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页面异常显示白模板的问题及其解决方式.