搜了很久，很难找到一个详细入微，开箱即用的方案。 于是我 百折不挠的，搞出来一个，也不知道是不是最完美的方案，有什么可以优化的地方可以指出，谢谢。 首先， 1.项目目录下(与src平级)，新增config/webpack.config.js文件，内容如下: View Code 2.聚焦package.json a.添加代码:为了让webpack 走我们写的 配置文件 View Code b.修改代码:新增命令 View Code 配置了上述命令，我们就可以用 类似 npm run ionic:serve:dev 的命令 执行 后面的命令内容(set NODE_ENV=dev && ionic-app-scripts serve --dev) 3.新增environments文件夹，如下，其中dev环境对应的配置文件 默认用 environment.ts 4.environments下面的文件内容：(我只给出了dev的配置文件内容，可以按照dev的写出其他的环境的配置文件，其实就是一个对象) View Code 5.聚焦到tsconfig.json，新增代码(在compilerOptions下) View Code 6.到了这里基本就配置好了，webpack 会根据 你在命令行敲的命令 分别的去 加载不同环境的配置文件，去测试下吧 打开main.ts新增代码， View Code 然后在命令行敲 npm run ionic:serve:prod，在浏览器的控制台就可以看到 当前的 env变量，也就是 配置文件中的对象， 切换到 npm run ionic:serve:dev，发现env变了，这样就节省了 每次不同环境重新打包的时候，修改文件的必要。 7.env变量已经拿到了，但是怎么在我们的page里面使用呢？每个页面都引入一遍么？那岂不是很麻烦 我们就用provider 的 方法 引入好了 打开app.moudle.ts provider中新增 { provide: 'ENV', useValue: ENV }, 这样其他的页面都可以引入这个provider， 例如：login.ts中 打开控制台看下 都打印出来了。 https://www.cnblogs.com/zwhblog/p/8953626.html