VUE项目打包发布到tomcat服务器上运行

1、项目打包路径配置将绝对路径改为相对路径目标文件：项目目录 > config文件夹 > index.jsassetsPublicPath:'/' 改为：assetsPublicPath:'./'（加一个点变为相对路径）2、配置背景图片等静态文件打包路径打包后的css文件夹内app.css文件访问static/img/’图片名’路径错误访问不到图片，在build文件内utils.js中

繁星、晚风

4264人浏览 · 2020-05-08 19:40:39

繁星、晚风 · 2020-05-08 19:40:39 发布

1、项目打包路径配置

将绝对路径改为相对路径

目标文件：项目目录 > config文件夹 > index.js

assetsPublicPath:'/' 改为：assetsPublicPath:'./'   （加一个点变为相对路径）

2、配置背景图片等静态文件打包路径

打包后的css文件夹内app.css文件访问static/img/’图片名’路径错误访问不到图片，在build文件内utils.js中配置路径。

目标文件：项目目录 > build文件夹 >utils.js

在图中所示位置添加代码

publicPath:'../../',

3、在命令行中用npm run build 进行打包。

npm run build

生成dist文件

4、发布到服务器

将dist文件夹放到tomcat服务器webapps下：

访问dist问价夹下的index.html文件。

如果对你有用的话，帮忙点个赞哦 ~😁

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^