vue项目二级路由刷新后样式丢失、错乱的解决方案及手机端实时访问

一、vue项目二级路由刷新后样式丢失、错乱的解决方案

1、如果路由采用的是mode:history 模式，则检查config/index.js 中的

module.exports = {

 build: {
 assetsPublicPath: '/',     // 这里不能加点 
} }

再检查公共样式的路径是否正确，比如公共样式 如果放在index.html中(其实公共样式还可以放在src/main.js 和src/App.vue中)，则检查路径/static/ 前是否有点

image.png

2、如果路由采用的是非mode:history 模式，则与上面的相反，都要加点；

其它，具体参见 vue-router先hash模式部署项目，然后开启histroy模式 ，引发的几个问题以及histroy模式的开启方式、优点

二、手机端实时访问npm run dev后的项目

1、修改config/index.js中的

module.exports = {

 dev: {
  host: '0.0.0.0',     // 原有为localhost
} }

2、用手机访问同一个局域网下的电脑端的ip地址加端口号

image.png