美文网首页
Vue CLI 3.0 配置build之后的目录结构

Vue CLI 3.0 配置build之后的目录结构

作者: 李颖轩_LiYingxuan | 来源:发表于2019-04-03 11:57 被阅读0次

    首先需要自己在项目根目录增加配置文件:vue.config.js

    主要可能是这个选项比较值得注意: assetsDir: "static",

    分享一下我的配置文件(MacOS):

    module.exports = {
      // 基本路径
      baseUrl: "/",
    
      // 输出文件目录
      outputDir: "dist",
    
      // eslint-loader 是否在保存的时候检查
      lintOnSave: true,
    
      // 配置js、css等文件夹的二级目录位置,不设置则会在dist下生成4个文件夹
      assetsDir: "static",
    
      // use the full build with in-browser compiler?
    
      // https://vuejs.org/v2/guide/installation.html#Runtime-Compiler-vs-Runtime-only
      // runtimeCompiler: false,
    
      // webpack配置
    
      // see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
      chainWebpack: () => {},
    
      configureWebpack: () => {},
    
      // vue-loader 配置项
    
      // https://vue-loader.vuejs.org/en/options.html
      // vueLoader: {},
    
      // 生产环境是否生成 sourceMap 文件
      productionSourceMap: true,
    
      // css相关配置
      css: {
        // 是否使用css分离插件 ExtractTextPlugin
        extract: true,
    
        // 开启 CSS source maps?
        sourceMap: false,
    
        // css预设器配置项
        loaderOptions: {},
    
        // 启用 CSS modules for all css / pre-processor files.
        modules: false
      },
    
      // use thread-loader for babel & TS in production build
    
      // enabled by default if the machine has more than 1 cores
      parallel: require("os").cpus().length > 1,
    
      // 是否启用dll
    
      // See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#dll-mode
      //dll: false,
    
      // PWA 插件相关配置
    
      // see https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-pwa
      pwa: {},
    
      // webpack-dev-server 相关配置
      devServer: {
        open: process.platform === "darwin",
        host: "0.0.0.0",
        port: 8080,
        https: false,
        hotOnly: false,
        proxy: null, // 设置代理
        before: app => {}
      },
      // 第三方插件配置
      pluginOptions: {
        // ...
      }
    };
    
    

    The end.

    相关文章

      网友评论

          本文标题:Vue CLI 3.0 配置build之后的目录结构

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