vue 常遇到问题之—— 异常白页面

  • 有些人在配置vue项目时,在测试阶段会出现白页面的现象,打开页面一片空白什么都没有,可能很多朋友都束手无策,
    明明什么都没有更改原配置是怎么出现的出现的错误呢?

  • 我就遇到过这样的问题,接下来为大家讲一下到底是哪里出了问题:
    • 第一点:
      mian.js 文件里配置axios是会出现部分问题,
      请大家仔细观察下面两段代码有何不同:
      •   // The Vue build version to load with the `import` command
          // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
          import Vue from 'vue'
          import App from './App'
          import router from './router'
          import axios from 'axios'
        
          Vue.config.productionTip = false
          Vue.prototype.axios = axios
        
          /* eslint-disable no-new */
          new Vue({
            el: '#app',
            router,
            components: { App },
            template: '<App/>'
          })
      •   // The Vue build version to load with the `import` command
          // (runtime-only or standalone) has been set in webpack.base.conf with an alias.
          import Vue from 'vue'
          import App from './App'
          import router from './router'
          import axios from 'axios'
        
          Vue.config.productionTip = false
          vue.prototype.axios = axios
        
          /* eslint-disable no-new */
          new Vue({
            el: '#app',
            router,
            components: { App },
            template: '<App/>'
          })
        • 仔细的人可能会发现配置 axios 时的 vue大小写不同.
          没错,第一点就是要注意vue.prototype.axios = axios的首字母是否大写.
    • 第二点:
      就是检查 App.vue文件里是否将 <div id="app"> ······ </div>
      不小心误删掉了.
  • 这就是我所遇到的有关 vue页面异常显示白模板的问题及其解决方式.

猜你喜欢

转载自www.cnblogs.com/chao460/p/12167415.html