在vue.config.js文件中什么配置公共打包路径

JavaScript09

在vue.config.js文件中什么配置公共打包路径,第1张

1在项目中找到static文件夹,在里面创建一个配置文件,起名为config.js

如果不清楚项目结构的可以看一下前面我写的Vue项目目录结构说明与配置

2.然后在创建的config.js配置文件中,声明一个对象Glob,将它赋值给window,对象名字随便取,只要不占用关键字即可,对象中存放你所需要配置的各种路径和数据,如下:

这里说明下,赋值给window,在vue里面获取不到window对象。所以不要赋值给window,直接定义个常量就好。

3.将此配置文件在index.html 文件中引入

4.使用。到这里相信会一点js基础知识的同学都知道怎么在项目中使用我们配置的数据,没错就是 Glob,比如我们要配置axios请求路径如下:不清楚怎么配置的同学可以看一下前面我写的vue axios请求 配置

下面在 packge.json 文件中,创建一条命令

在 build文件夹中,复制build.js文件,并且重新命名为 build_dev.js

下面的变量用于判断打包那个配置环境

此处才是真正的换打包的地方。在build文件夹中找到 webpack.prod.conf 文件,修改下面的打包配置

此处略过一些配置测试与正式环境详情了。在 config 文件中的 dev.env.js与prod.env.js 文件,进行配置变量。在axios 封装的文件中,使用 process.env.xx进行获取数据

进行 npm run build_dev(测试环境) ,npm run build(正式环境)。下面就是请求了。