美文网首页vue
vue-cli3.0中vue.config.js(自行整理)

vue-cli3.0中vue.config.js(自行整理)

作者: 匆匆那年_海 | 来源:发表于2019-05-17 17:58 被阅读9次

    const webpack = require('webpack');
    const TerserPlugin = require('terser-webpack-plugin');
    module.exports = {
    // 项目部署的基础路径,我们默认假设你的应用将会部署在域名的根部,
    // 比如 https://www.my-app.com/
    // 指定子路径。比如,如果你的应用部署在https://www.foobar.com/my-app/
    // 那么将这个值改为 /my-app/
    publicPath: './',
    // 将构建好的文件输出到哪里
    outputDir: 'dist',
    // 放置静态资源的地方 (js/css/img/font/...)
    assetsDir: './assets',
    // 是否在保存的时候使用 eslint-loader 进行检查。
    // 有效的值:true | false | "error"设置为 "error" 时,检查出的错误会触发编译失败。
    lintOnSave: false,
    // 是否使用包含运行时编译器的 Vue 构建版本。设置为 true 后你就可以在 Vue 组件中使用 template 选项了,但是这会让你的应用额外增加 10kb 左右
    runtimeCompiler: true,
    //默认情况下 babel-loader 会忽略所有 node_modules 中的文件。如果你想要通过 Babel 显式转译一个依赖,可以在这个选项中列出来
    transpileDependencies: [ /* string or RegExp */],
    // 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建。
    productionSourceMap: false,
    // 调整内部的 webpack 配置。
    // 查阅 https://github.com/vuejs/vue-docs-zh-cn/blob/master/vue-cli/webpack.md
    chainWebpack:
    config => {
    config.plugins.delete('html');
    config.plugins.delete('preload');
    config.plugins.delete('prefetch')
    },
    configureWebpack: {
    optimization: {
    minimizer: [new TerserPlugin({ terserOptions: { compress: { drop_console: true } } })]
    }
    },
    pages: {
    index: {
    // 入口文件
    entry: './src/main.js',
    // 模版文件
    template: 'public/index.html',
    // 输出文件名
    filename: 'index.html'
    }
    },
    // CSS 相关选项
    css: {
    // 将组件内的 CSS 提取到一个单独的 CSS 文件 (只用在生产环境中)
    // 也可以是一个传递给 extract-text-webpack-plugin 的选项对象
    extract: true,
    // 是否开启 CSS source map?
    sourceMap: false,
    // 向 CSS 相关的 loader 传递选项
    loaderOptions: {},
    // 默认情况下,只有 *.module.[ext] 结尾的文件才会被视作 CSS Modules 模块。设置为 true 后你就可以去掉文件名中的 .module 并将所有的 *.(css|scss|sass|less|styl(us)?) 文件视为 CSS Modules 模块。
    // 这个选项不会影响 *.vue 文件。
    modules: false
    },
    // 在生产环境下为 Babel 和 TypeScript 使用 thread-loader
    // 在多核机器下会默认开启。
    parallel: require('os').cpus().length > 1,
    // PWA 插件的选项。
    // 查阅 https://github.com/vuejs/vue-docs-zh-cn/blob/master/vue-cli-plugin-pwa/README.md
    pwa: {
    iconPaths: {
    favicon32: 'favicon.ico',
    favicon16: 'favicon.ico',
    appleTouchIcon: 'favicon.ico',
    maskIcon: 'favicon.ico',
    msTileImage: 'favicon.ico'
    }
    },
    // 配置 webpack-dev-server 行为。
    devServer: {
    // open: process.platform === 'darwin',
    open: true,
    host: '0.0.0.0',
    port: 8080,
    https: false,
    hotOnly: false,
    // 查阅 https://github.com/vuejs/vue-docs-zh-cn/blob/master/vue-cli/cli-service.md#配置代理
    proxy: null, // string | Object
    // proxy: {
    // "/api": {
    // // 目标:指向网络地址
    // target: "https://api.douban.com",
    // // webpack属性,映射一个host
    // changeOrigin: true,
    // pathRewrite: {
    // "/api": ""
    // }
    // }
    // }, // string | Object
    },
    // 三方插件的选项
    pluginOptions: {
    // ...
    }
    }

    相关文章

      网友评论

        本文标题:vue-cli3.0中vue.config.js(自行整理)

        本文链接:https://www.haomeiwen.com/subject/rczoaqtx.html