VUE3.0升级与配置(跨域、全局scss变量等)

1.检查本机vue版本

vue -V

2.升级vue3.0命令

npm install -g @vue/cli

3.建立完项目后,在项目根目录新增vue.config.js文件,插入代码(简洁)

 1 module.exports = {  2   runtimeCompiler: true, //是否使用包含运行时编译器的 Vue 构建版本
 3   publicPath: '',  4   productionSourceMap: false, //不在production环境使用SourceMap
 5  devServer: {  6     //跨域
 7     port: 9527, // 端口号
 8     open: true, //配置自动启动浏览器
 9  proxy: { 10       // 配置跨域处理 能够设置多个
11       '/api': { 12         target: 'xxxx', 13         ws: true, 14         changeOrigin: true
15  } 16  } 17  } 18 }

4.设置scss/sass全局变量css

 1 module.exports = {  2   // ...
 3  css: {  4  loaderOptions: {  5  sass: {  6  data: `  7           @import "@/assets/styles/_variable.scss"; // 路径自配  8  `  9  } 10  } 11  } 12 }

官网配置地址:https://cli.vuejs.org/zh/config/#vue-config-jsvue

须要注意的是,baseUrl从 Vue CLI 3.3 起已弃用,须要使用publicPathnpm

相关文章
相关标签/搜索