Vue-cli全局配置整理

Vue-cli配置简单明了,内部还自带了webpack,默认已经有development  test production三种模块,支持自定义环境变量来区分打包产物,所以将vue-cli常用配置整理出来,以备不时只需. 

  //baseUrl:'./',//cli3.3开始已启用 请使用publicPath
  //发布路径  会覆盖vue-cli中的 BASE_URL
  publicPath: process.env.VUE_APP_MODE === 'prod'
      ? '/prod-h5/'
      : process.env.VUE_APP_MODE === 'other'?'/other-h5/':'./',
  outputDir:'dist',//默认打包路径
  assetsDir:'static',//生成的静态资源目录,
  indexPath:'index.html',//生成Index.html的路径
  filenameHashing:true,//默认情况下,生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存,
                        // 只有vue-cli生成index.html才生效,使用其他非自动生成的将此值设置false

  //在 multi-page 模式下构建应用。每个“page”应该有一个对应的 JavaScript 入口文件。其值应该是一个对象,对象的 key 是入口的名字,value 是:
 //一个指定了 entry, template, filename, title 和 chunks 的对象 (除了 entry 之外都是可选的);
 //或一个指定其 entry 的字符串
  pages:{//
    index: {
      // page 的入口
      entry: 'src/index/main.js',
      // 模板来源
      template: 'public/index.html',
      // 在 dist/index.html 的输出
      filename: 'index.html',
      // 当使用 title 选项时,
      // template 中的 title 标签需要是 <%= htmlWebpackPlugin.options.title %>
      title: 'Index Page',
      // 在这个页面中包含的块,默认情况下会包含
      // 提取出来的通用 chunk 和 vendor chunk。
      chunks: ['chunk-vendors', 'chunk-common', 'index']
    },
    // 当使用只有入口的字符串格式时,
    // 模板会被推导为 `public/subpage.html`
    // 并且如果找不到的话,就回退到 `public/index.html`。
    // 输出文件名会被推导为 `subpage.html`。
    subpage: 'src/subpage/main.js'
  },
  //保存时lint检查  需要安装  @vue/cli-plugin-eslint
  // true/warning   编译警告 不会使编译失败
  //default  强制输出为编译错误,会导出编译失败
  //error 同 default
  //你也可以通过设置让浏览器 overlay 同时显示警告和错误
  //devServer: {
  //     overlay: {
  //       warnings: true,
  //       errors: true
  //     }
  //   }
  lintOnSave:'default',//process.env.NODE_ENV !== 'production'?'default':false
  runtimeCompiler:false,//是否使用包含运行时编译器的 Vue 构建版本。设置为 true 后你就可以在 Vue 组件中使用 template 选项了,但是这会让你的应用额外增加 10kb 左右
  transpileDependencies:[],// boolean [] reg  默认情况下 babel-loader 会忽略所有 node_modules 中的文件。你可以启用本选项,以避免构建后的代码中出现未转译的第三方依赖
  productionSourceMap:false,//是否需要生产环境生成sourcemap
  crossorigin:undefined,//设置生成的 HTML 中 
                    
                    

你可能感兴趣的:(vue.js,前端,javascript,前端框架)