当前位置:   article > 正文

如何解决vue2.0 打包之后 打开index.html出现空白页_vue2框架 build后index.html是空白 怎么弄

vue2框架 build后index.html是空白 怎么弄

如何解决vue2.0 打包之后 打开index.html出现空白页

如何解决vue2.0 打包之后 打开index.html出现空白页

   1.打包之前修改三个文件
       1.1.第一步,找到build文件,在webpack.prod.conf.js 第25行左右 有一个对象为 output,在这里面增加一行代码

publicPath:'./'
  1.   output: {
  2. //在这里加一行代码
  3. publicPath:'./',
  4.     path: config.build.assetsRoot,
  5.     filename: utils.assetsPath('js/[name].[chunkhash].js'),
  6.     chunkFilename: utils.assetsPath('js/[id].[chunkhash].js')
  7.   },
  8.    

1.2.第二步,找到utils.js,在 第47行左右 有一个if判断为 if (options.extract),在这里面增加一行代码

     注意:这个是保证 加载背景图片等css样式资源不出现 路径问题

publicPath:'../../'
  1. if (options.extract) {
  2. return ExtractTextPlugin.extract({
  3. publicPath:'../../',
  4. use: loaders,
  5. fallback: 'vue-style-loader'
  6. })
  7. }

 

1.3.第三步,找到config/index.js第46行左右 修改assetsPublicPath 路径为 './';

2.然后你就可以  build 了,

3.如果build 完成后 在本地还是空白页  或者说 放到服务器上面 是空白页  怎么办

   3.1 这个就有可能是 你的路由模式  出现了问题  你给的路由模式可能是history 模式 ,这个文档说了 如果设置这个模式的话需要后端的配合 设置一些参数的 ,所以如果没有后端的配合的话 ,你就把这个路由的mode 改为 hash  或者是直接删除  就是默认的模式了

转自:https://www.cnblogs.com/sujiahao/p/11384723.html 收藏使用

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/IT小白/article/detail/258617
推荐阅读
相关标签
  

闽ICP备14008679号