vue/cli配置

95 阅读2分钟
module.exports = {
    publicPath: '/', // 部署应用包时的基本url
    outputDir: 'dist', // 打包输出目录
    assetsDir: '', // 生成静态资源的目录
    indexPath: 'index.html', // 生产index.html的路径
    filenameHashing: true, // 生成的静态资源是否包含hash
    // pages: {
    //     // undefined  // 多页面应用的配置
    //     index: {
    //         entry: 'src/main.js',
    //         template: 'public/index.html',
    //         filename: 'index.html',
    //         title: 'my title',
    //         chunks: ['index'],
    //     },
    //     subpage: 'src/subpage/main.js', // 入口为字符串格式时,模板推导为public/index.html,如果找不到就回退到public/index.html。输出名为subpage.html
    // },
    lintOnSave: true, // 是否保存时lint代码,false:关闭,true & warning :在控制台警告,error:编译会提示失败 。default:
    runtimeCompiler: false, // 是否可以使用运行时编译,true就可以在vue组件中使用template选项,会增加10K左右的体积
    transpileDependencies: [], //默认babel-loader会忽略node_modules中的文件,要想显示转译一个依赖,可以在数组中列出来
    productionSourceMap: true, // 是否在生产环境下启用source map
    crossorigin: undefined, // 设置生成的link和script标签的crossorigin属性
    integrity: false, // 是否在生成的link和script标签上启用Subresource integrity (SRI),
    parallel: require('os').cpus().length > 1, // 是否为Babel或typescript启用trread-loader,
    configureWebpack(config) {
        // object 值为object会被webpack-merge合并到最终配置中,如果为函数,可以修改config,也可以返回一个被克隆或者合并过的配置版本
        console.log(config);
    },
    chainWebpack(instance) {
        // 接受一个基于webpack-chain的配置实例,允许对内部的webpack配置进行更细粒度的修改
        // console.log(instance);
    },
    css: {
        // default {}
        requireModuleExtension: true, // require('./css/style.module.css') 启用CSS Module时,是否需要.module后缀
        extract: process.env.NODE_ENV === 'production' ? true : false, // object  是否css抽离到单个文件中
        sourceMap: false, //是否为css启用source map
        loaderOptions: {
            // 向css相关的loader传递选项
            css: {},
            less: {},
            // postcss: {},
            sass: {},
        },
    },
    // devServer: {
    //     // 支持所有的webpack-dev-server选项
    //     host: true,
    //     port: 3000,
    //     https: false,
    //     proxy: {
    //         // 代理服务器配置
    //         '/api': {
    //             target: 'http://localhost:3000',
    //             ws: true,
    //             changeOrigin: true,
    //         },
    //     },
    // },
    pwa: {}, // 向PWA插件传递选项
    pluginOptions: {
        // 用来传递任何第三方插件选项
        foo: {
            // 插件可以作为options.pluginOptions.foo访问这些选项
        },
    },
};