最近项目正在优化。乘着有时间看了一下 vue-cli3.0.x 使用 。感觉还蛮不错的。 因为之前项目使用的 vue-cli 2 创建的，强行使用 eslint让我们很难受，一些与项目无关的 “build” 和 “config” ，让人看着就有一些不爽 。由于公司环境比较多，需要测试环境的配置。增加了 “”tt”: “node build/tt-build.js”” 。到 3.0.x 应该怎么用？ 带着这些问题来看 3.0.x 感觉就好多了。
1. 官网资料
在学习技术的时候，经常看查看官网的资料。因为那里的资料更新是最快的 。
vue-cli
vue-cli 文档
2. 安装环境
这里犸特
Vue CLI 3.0.x 是一个重要的升级，它带来了许多改进和优化，使得Vue.js项目的构建过程更加便捷和高效。本文将围绕Vue CLI 3.0.x 的特点、安装、多环境配置等方面展开讨论。
Vue CLI 3.0.x 对比之前的2.0版本，最大的变化之一是其内置了ESLint集成，这让开发者在编码时可以得到更规范的代码提示，提高了代码质量。同时，不再需要像2.0那样手动处理"build"和"config"目录，因为这些配置现在已经被更好地抽象和简化，减少了无关的配置文件，使项目结构更加清晰。
关于安装，Vue CLI 3.0.x 推荐使用全局安装命令 `npm install -g @vue/cli` 或者 `yarn global add @vue/cli`。值得注意的是，如果你选择使用yarn，可能需要额外的设置步骤，如进入目录并执行 `yarn link`，以确保`vue`命令可用。之后，可以通过 `vue create my-project` 来创建新的项目，这与2.0时代的 `vue init` 命令有所不同。
多环境配置是Vue CLI 3.0.x 的一大亮点。在2.0.x版本中，可能需要在`package.json`中添加自定义脚本来实现不同环境的配置，而在3.0.x中，引入了`.env`文件系统。默认情况下，Vue CLI 3.0.x 提供了`.env.development`, `.env.production`和`.env.test`三个文件，分别对应开发、生产及测试环境。`.env`文件中的变量以 `VUE_APP_` 开头，例如 `.env.production` 文件内的 `VUE_APP_MOCK_URL = 'https://xxx.xxx.xxx/restapi/'`，在代码中可以通过 `process.env.VUE_APP_MOCK_URL` 访问该变量。
为了指定不同的环境配置，可以在`package.json`中添加自定义脚本，例如 `"dev-build": "vue-cli-service build --mode development"`，这样就能在开发环境下运行特定的构建任务。而`process.env.NODE_ENV` 变量可以用来判断当前的运行环境，例如区分开发、测试和生产环境。此外，如果你需要修改公共路径（BASE_URL），可以在`vue.config.js`文件中进行配置。
总结来说，Vue CLI 3.0.x 的改进主要体现在更友好的开发体验、更简洁的配置结构以及强大的多环境配置支持上。通过使用官方文档和最新的安装方法，开发者可以快速上手并充分利用这些新特性，提高开发效率，同时保持代码质量。对于拥有多个环境的企业级项目，Vue CLI 3.0.x 的环境配置能力无疑是一个巨大的福音，它减少了人为错误，确保了一次配置，多处应用的原则。
