umi 配置多环境打包

cyrils 发布于2019-08-23 15:04 / 768人阅读

摘要：平时我们开发应用时环境有开发环境测试环境生产环境等此时我们需要配置不同的环境获取不同的前缀，以满足日常开发需要。安装插件在文件里配置开发环境的复制两次，并更改文件名为和分别配置在其他文件可以获取作为前缀如封装的在的处配置打包命令

平时我们开发应用时环境有开发环境、测试环境、生产环境等,此时我们需要配置不同的环境,获取不同的apiUrl前缀，以满足日常开发需要。

1.安装 cross-env 插件

npm install --save-dev cross-env

2.在config/config.js文件里配置开发环境的apiUrl

 define: {
    "process.env.apiUrl":"https://www.dev.com/"
  },

3.复制两次config/config.js，并更改文件名为config/config.test.js 和 config/config.prod.js,分别配置apiUrl

// config.test.js
 define: {
    "process.env.apiUrl":"https://www.test.com/"
  },

// config.prod.js
 define: {
    "process.env.apiUrl":"https://www.prod.com/"
  },

4.在其他文件可以获取process.env.apiUrl 作为url前缀,如封装axios的request.js

// request.js
console.log(process.env.apiUrl);

5.在package.json 的scripts处配置打包命令

"build-dev": "cross-env UMI_ENV=dev umi dev",
"build-test": "cross-env UMI_ENV=test umi build",
"build-prod": "cross-env UMI_ENV=prod umi build",

超融合服务器专线服务多文件打包 Umi 多租户环境多线程环境

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/101465.html

UMI.js使用方法

摘要：或者在中导入样式文件存放全局通用请求存放通用方法这是时生产的临时目录，默认包含和，有些插件也会在这里生成一些其他临时文件。项目中常用于发送请求，等待服务端响应数据。如果使用的装饰器则为 umi.js使用方法 node环境安装在官网下载与系统相应的node版本，node.js版本>=8.10 编辑器推荐使用Visual Studio Code 安装方法安装umi npm insta...

hearaway 2019-08-23 16:56 评论0 收藏0
cross-env使用以及根据环境打包

摘要：例外是上的，它使用本机。同样，和命令如何利用环境变量也有所不同。第二步，修改文件新增一条如上命令当执行时，设置为同理设置为然后在文件中即可根据这个变量设置相应的路径。关于文章首发于使用以及根据环境打包关于之前的项目打包都是靠手动去改环境变量(纯属沙雕行为)，随着项目越来越多，每一个项目打包都要去改这个变量的话真的是太蛋疼了，所以研究了一下webpack打包以及node env 主...

bbbbbb 2019-08-23 18:24 评论0 收藏0
【umi插件开发】控制台二维码

摘要：在外部没有好的检查方案，好在在今年月的一个更新中，在事件中提供了，这为插件获取端口号提供了简便的接口，具体可查看。擅长网站建设公众号开发微信小程序开发小游戏公众号开发，专注于前端领域框架交互设计图像绘制数据分析等研究。前言在进行移动端webapp开发时，你是否会想要在真机上调试项目。下面分析一下本地运行项目时，真机调试需要的步骤和麻烦的点。你需要将手机和运行项目的电脑连接到同一...

testbird 2019-08-26 10:22 评论0 收藏0
Umi.js

摘要：，中文可发音为乌米，是一个可插拔的企业级应用框架。以路由为基础的，支持类的约定式路由，以及各种进阶的路由功能，并以此进行功能扩展，比如支持路由级的按需加载。全局存于目录，所有页面都可引用页面不能被其他页面所引用。 umi，中文可发音为乌米，是一个可插拔的企业级 react 应用框架。umi 以路由为基础的，支持类 next.js 的约定式路由，以及各种进阶的路由功能，并以此进行功能扩展...

30e8336b8229 2019-08-26 13:29 评论0 收藏0
React框架Umi实战(3)路由进阶

摘要：的路径是相对于的。在需要权限控制的的路由下使用属性配置。这些框架其实都是比较好上手，关键还是的基础要掌握好，还有的语法。前面的课程都是使用的约定路由，就是自动生成的，但是我们做项目大部分都是涉及权限控制的，这时就还是得用控制路由，仅今天就来改进一下 1 修改配置.umirc.js // ref: https://umijs.org/config/ export default {...

fasss 2019-08-05 16:01 评论0 收藏0