查了半天,都是vue3的配置,以下操作,亲测有效;
比如这里一级目录为: 127.0.0.1:80/
二级目录下部署vue项目: 127.0.0.1:80/demo/
按如下配置即可
1.index.html head标签内添加
<head>
<meta base="/demo/">
</head>
2.config/index.js
build:{
assetsSubDirectory: 'static',
assetsPublicPath: '/demo/',
}
3.router.js
const router = new VueRouter({
mode: 'hash',
base:'/demo/', // 这是二级路径
routes
})
4.如果页面上有动态修改css的设置,比如
<!-- index.html里直接引用这样写即可 -->
<link rel="stylesheet" href="./static/css/theme/normal.css">
<!-- js动态引用 -->
<link rel="stylesheet" href="" id="themeStyle">
// js动态引用,需要加上目录 /demo/
document.getElementById('themeStyle').href = `/demo/static/theme/blue.css`