3.Vue工程打包部署

Vue工程打包部署

视频演示地址：https://www.bilibili.com/video/BV1jTepeTEoe/?vd_source=0f4eae2845bd3b24b877e4586ffda69a

vue.config.js 中配置打包参数：

publicPath、outputDir、assetsDir、indexPath、productionSourceMap

 // 项目部署的基本路径，默认 "/"
  publicPath: process.env.NODE_ENV === "production" ? "./" : "/",
  // 项目打包的根目录，默认 "dist"
  outputDir: "dist",
  // 项目打包的静态资源存放目录，默认 ""
  assetsDir: "",
   // 项目打包的index.html输出路径，默认 "index.html"
   indexPath: "index.html",
   // 项目打包是否生成js的 source map 调试包，默认 true，生产部署设置为false
  productionSourceMap: false,

打包

npm run build

打包后，把dist包放到tomcat的webapps下，浏览器访问localhost:8080/dist 成功访问，并且样式生效，则成功