vue_项目完成之后项目构建

项目构建

当项目完成后，我们需要将项目build以生成静态内容，脱离nodejs

npm run build 

# 或者

yarn build

执行build命令后我们将拥有一个dist文件夹。将dist文件夹中的内容部署到对应的服务器即可。如果使用了history模式，那么需要另外的对web服务器进行相关的设置

静态资源路径设置

如果我们想要改变构建后的项目中引入的静态资源路径，我们需要创建vue.config.js在这里对我们原本的配置进行覆盖

process.env.NODE_ENV

这个变量可以取两个值

• production
  npm run build时这个值为production
• development
  npm run serve时这个值为development

服务器代理

进行前后端分离开发时，必跨域，我们可以再vue.config.js中设置devServe.proxy，设置后可以进行代理。但是，当我们build之后，代理失效。需要后台将我们的静态资源放在和接口一致的服务器中

module.export = {
  devServe: {
    proxy: '需要被代理的接口'
  }
}

设置完成后，我们在请求接口时，就不需要再写url了。

不同的环境配置不同的接口前缀

公共接口的位置

axios.defaults.baseURL = process.env.NODE_ENV === 'production' ? '生产环境接口' : '开发环境接口'