vue.config文件配置项明细

module.exports = {
	// 判断环境
    // publicPath:process.env.NODE_ENV === 'production' ? '/vue_workspac/aihuhuproject/' : '/',
    // 默认的'/'是绝对路径,如果不确定在根路径,改成相对路径'./'
    publicPath: './',
    // 输出文件目录
    outputDir: 'dist',
    assetsDir: 'static',
    indexPath: 'index.html',
    // eslint-loader 是否在保存的时候检查
    lintOnSave: true,
    // 生产环境是否生成 sourceMap 文件
    productionSourceMap: false,
    // css相关配置
    css: {
        // 是否使用css分离插件 ExtractTextPlugin
        extract: true,
        // 开启 CSS source maps?
        sourceMap: false,
    },
    // webpack-dev-server 相关配置
	// 遍历打包js文件生成对应map文件
    // configureWebpack(config) {
    //  config.plugins.push(
    //    new webpack.SourceMapDevToolPlugin({
    //     fileName: 'sourcemap/[file].map',
    //     append: false
    //   })
    //  );
    //  return {
    //     resolve:{
    //       alias:{
    //       '@': resolve('src')
    //      }
    //     },
    //     devtool: 'source-map',
    //     plugins: [
         
    //    ]
    //   }
    // },
    devServer: {
		// open 在devServer启动且第一次构建完成时,自动用我们的系统的默认浏览器去打开要开发的网页
        open: false,
		// 默认是 localhost。如果你希望服务器外部可访问,指定如下 host: '0.0.0.0',设置之后之后可以访问ip地址
        host: '0.0.0.0',
        port: 8080,
		// hot配置是否启用模块的热替换功能,devServer的默认行为是在发现源代码被变更后,通过自动刷新整个页面来做到事实预览,开启hot后,将在不刷新整个页面的情况下通过新模块替换老模块来做到实时预览。
        hot: true,
        https: false,
		// hot 和 hotOnly 的区别是在某些模块不支持热更新的情况下,前者会自动刷新页面,后者不会刷新页面,而是在控制台输出热更新失败
        hotOnly: false,
        proxy: {
            '/': {
				// 接口域名
                target: 'http://xxxx:8080',
				// false为http访问,true为https访问
                secure: false, 
				// 是否跨域
                changeOrigin: true,
				// 重写接口
                pathRewrite: {
                    '^/': '/' 
                }
            }
        }, 
	   // 设置代理
        before: app => { }
    },
    // 第三方插件配置
    pluginOptions: {}
};

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
vue.config.js文件Vue目的配置文件,用于配置目的构建、开发和部署等方面的设置。在这个文件中,你可以修改默认的配置,以满足目的特殊需求。 以下是一些常见的配置及其解释: 1. publicPath: 指定目部署的基础路径,默认为'/'。可以根据实际情况修改,比如部署到子路径时需要修改为对应的路径。 2. outputDir: 指定打包输出的目录,默认为'dist'。可以修改为其他目录名。 3. assetsDir: 指定静态资源(js、css、img等)的输出目录,默认为''(即根目录)。可以修改为其他目录名。 4. indexPath: 指定生成的index.html文件的输出路径,默认为'index.html'。可以修改为其他文件名或路径。 5. devServer: 配置开发服务器的相关选,比如端口号、代理等。 6. configureWebpack: 提供一个函数或对象,用于修改webpack配置。可以在这里添加额外的webpack配置。 7. chainWebpack: 提供一个函数,用于对webpack的内部配置进行更细粒度的修改。 8. productionSourceMap: 设置是否生成生产环境的source map,默认为true。可以根据需要进行调整。 9. css: 配置CSS相关的选,比如是否开启CSS source map、是否使用postcss、是否将CSS提取到单独的文件等。 10. pluginOptions: 用于配置第三方插件的选,比如webpack-bundle-analyzer、stylelint等。 以上只是一些常见的配置,实际上vue.config.js文件还有更多可用的配置。你可以根据目的需要进行相应的配置,以实现更好的开发和构建效果。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值