zoukankan      html  css  js  c++  java
  • vue-cli4中的配置项

    vue-cli4之中默认没有vue.config.js,所以需要自己来创建配置。vue.config.js就是打包的一些配置。

    这是一些比较基础的配置

    module.exports = {
      // 公共路径(必须有的)
      publicPath: "./",
      // 输出文件目录
      outputDir: "dist",
      // 静态资源存放的文件夹(相对于ouputDir)
      assetsDir: "static",
      // eslint-loader 是否在保存的时候检查(果断不用,这玩意儿我都没装)
      lintOnSave:false,
      // 我用的only,打包后小些
      runtimeCompiler: false,
      productionSourceMap: true, // 不需要生产环境的设置false可以减小dist文件大小,加速构建
    ​
      devServer: {
        open: true,  // npm run serve后自动打开页面
        host: '0.0.0.0',  // 匹配本机IP地址(默认是0.0.0.0)
        port: 8080, // 开发服务器运行端口号
        proxy: null,
      },
      resolve: {
         // resolve是webpack的内置选项,顾名思义,决定要做的事情,也就是说当使用 import "jquery",该如何去执行这件事
         // 情就是resolve配置项要做的,import jQuery from "./additional/dist/js/jquery" 这样会很麻烦,可以起个别名简化操作
         extensions: ['.js', '.vue', '.json'], // 省略扩展名,也就是说.js,.vue,.json文件导入可以省略后缀名,这会覆盖默认的配置,所以要省略扩展名在这里一定要写上
         alias: {
            //后面的$符号指精确匹配,也就是说只能使用 import vuejs from "vue" 这样的方式导入vue.esm.js文件,不能在后面跟上 vue/vue.js
           'vue$': 'vue/dist/vue.esm.js',
          // resolve('src') 其实在这里就是项目根目录中的src目录,使用 import somejs from "@/some.js" 就可以导入指定文件,是不是很高大上
           '@': resolve('src')
        }
      }
    }

    按照自己的要求改一下就可以了,注意runtimeCompiler: false,,不能写成compiler,已经被废弃了。另外就是把assetsDir设置成 static,一般都是static目录,不然默认的会是assets。

    之后进行打包

    cnpm run build
  • 相关阅读:
    如何添加mysql到环境变量
    SQLyog客户端无法连接MySQL服务器
    linux下插入的mysql数据乱码问题及第三方工具显示乱码问题
    mysql-5.7.10产生的日志时间与系统时间不一致
    linux—文件目录简单介绍
    python编程中的if __name__ == 'main' 的作用和原理
    Windows下Python版本的切换
    python—第三库的安装方法
    阿里云ubuntu16.04安装beef
    xss利用-beef攻击-演示
  • 原文地址:https://www.cnblogs.com/ranyihang/p/12892160.html
Copyright © 2011-2022 走看看