vue3打包后打开页面部分空白如何解决?
我个人的原因是router的history模式引起的。做以下几点,问题解决。1.修改vue.config.jsconst { defineConfig } = require('@vue/cli-service')//const path = require("path");//const resolve = function(dir) {//return path.join(__dirname,
·
我个人的原因是router的history模式引起的。
做以下几点,问题解决。
1.修改vue.config.js
const { defineConfig } = require('@vue/cli-service')
//const path = require("path");
//const resolve = function(dir) {
// return path.join(__dirname, dir);
//};
module.exports = defineConfig({
publicPath: process.env.NODE_ENV === 'production' ? './' : '/',
outputDir: 'dist',
indexPath: 'index.html',
transpileDependencies: true,
lintOnSave:false, //每次保存都启用eslint
/*chainWebpack: config => {//这里修改路径别名,不过对我无效
config.resolve.alias
.set("@", resolve("src"))
.set("@v", resolve("src/views"))
.set("@c", resolve("src/components"))
.set("@u", resolve("src/utils"))
.set("@s", resolve("src/service")); /!* 别名配置 *!/
config.optimization.runtimeChunk("single");
},*/
devServer: {
port:8000
}
})
2.修改router/index.js
import { createWebHistory, createRouter } from 'vue-router';
const history = createWebHistory("/");//这里加了"/"不知道是不是有效果 没测
const router=createRouter({
history,
routes})
3.最主要是这步,nginx修改配置
location / {
index index.php index.html error/index.html;
try_files $uri $uri/ /index.html;
}
重启nginx,好了
更多推荐
已为社区贡献1条内容
所有评论(0)