本文主要是介绍vue.config.js配置文件(build包通用),希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
vue.config.js配置文件
const path = require('path')
const resolve = dir => path.resolve(__dirname, dir)
const webpack = require('webpack')module.exports = {/* # # 基本路径 */publicPath: process.env.NODE_ENV === 'production' ? './' : '/',/* # # 输出文件目录--默认dist */outputDir: 'dist',/* # # 放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录。*/// assetsDir: '',/* # # 指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径。*/indexPath: 'index.html',/* # 默认情况下,生成的静态资源在它们的文件名中包含了 hash 以便更好的控制缓存。然而,这也要求 index 的 HTML 是被 Vue CLI 自动生成的。如果你无法使用 Vue CLI 生成的 index HTML,你可以通过将这个选项设为 false 来关闭文件名哈希。*/filenameHashing: true,/* # 构建多页时使用 */pages: undefined,lintOnSave: true,/* # 是否使用包含运行时编译器的Vue核心的构建 */runtimeCompiler: false,/* # 默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖,可以在这个选项中列出来 */transpileDependencies: [],/* # 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。*/productionSourceMap: false, /* # 设置生成的 HTML 中 <link rel="stylesheet"> 和 <script> 标签的 crossorigin 属性。*/crossorigin: undefined,/* # 在生成的 HTML 中的 <link rel="stylesheet"> 和 <script> 标签上启用 Subresource Integrity (SRI)。如果你构建后的文件是部署在 CDN 上的,启用该选项可以提供额外的安全性。*/integrity: false,/* # webpack-dev-server 相关配置 */devServer: {host: '0.0.0.0',port: 9000,https: false,open: true,hotOnly: false,proxy: null, // 设置代理hot:true},/* # 对内部的 webpack 配置进行更细粒度的修改。*/chainWebpack: (config) => { // 修复HMRconfig.resolve.symlinks(true);//修复 Lazy loading routes Errorconfig.plugin('html').tap(args => {args[0].chunksSortMode = 'none';return args;});// 添加别名config.resolve.alias.set('@', resolve('src')).set('assets', resolve('src/assets')).set('common', resolve('src/common')).set('components', resolve('src/components'));},/* # 是否为 Babel 或 TypeScript 使用 thread-loader。*/parallel: require('os').cpus().length > 1,/* # PWA 插件相关配置 */pwa: {},/* # 第三方插件配置 */pluginOptions: {}
}
注意:检查该文件是否在项目文件夹里面(自己经常放的层级不对,build错误了)
这篇关于vue.config.js配置文件(build包通用)的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!