Vue-cli3.x 配置

978 阅读1分钟

之前写了一个2.x的配置,发现vue-cli2.x的很是繁琐,vue-cli3.x 的功能是强大,也很方便,都集成了,只需要修改或者覆盖就行了,这里把工作中的配置记录下

首先你需要建立一个 vue.config.js 这也是官网所说的,不懂得可以去看官网

vue-cli3.0

如图  


let externals = {};if (process.env.NODE_ENV === 'production') {  // 这里是说打包时,不把这些打包进去,  externals = {    vue: 'Vue',    axios: 'axios',    "babel-runtime/core-js/promise": "Promise"  };}module.exports = {  baseUrl: process.env.REALEASE === "stable" ? "正式环境地址" : "测试环境地址",  productionSourceMap: false,  devServer: {    open: true,    proxy: {      "/api": {        target: "开发时的请求接口",        changeOrigin: true      }    }  },  configureWebpack: {    externals  },}

这里externals 是为了优化,防止把一些有cdn的 这些也打包进去,优化体积

具体可以去官网查看

还有vue-cli3.0具体配置,可以参考这个写的很好,这里我也借鉴下

1、安装,或者升级,这里指的已经安装过2.X的


可以装下 yarn 这个速度要快些,全局安装

2、创建项目


这里最好选择第二个,自己配置,而不用配置好的,因为配置好的很简陋


这里less 或者 sass 你看你习惯了,我是用的less,不过less安装 node-sass可能会卡住,因为npm装不上,可以选择cnpm  或者把镜像切到淘宝镜像,具体看我之前写的 nrm那一篇


然后是检测,这个最好vscode装一下插件


然后下载,然后自己创建个 vue.config.js 配置开头那一个图片的内容

配置参考