vue開發的項目中遇到的警告,報錯,配置項目文件等合集(長期更新)

1. Vue組件裏面data()裏面沒有return時觸發錯誤:Vue components Cannot read property '__ob__' of undefined

這個警告不解決會觸發錯誤:css

2. Vue項目開啓局域網訪問

有的項目好比移動端須要在手機上調試,這個時候須要用局域網開啓在手機上查看。vue

解決方法:在配置文件加 --host 0.0.0.0webpack

或者:ios

3.當咱們運行打包腳本npm run build或者打包ios weexpack build ios有可能會遇到如下報錯:ERROR in xxx.js from UglifyJs

這是由於webpack在打包vue文件時沒有成功轉換ES6的語法web

解決方法:npm

解決方法很簡單,加入babel-preset-es2015插件便可
一、安裝依賴包json

$ npm install --save-dev babel-preset-es2015babel

 

ps:babel-loaderbabel-core應該是默認裝好的,若是沒有安裝,請從新安裝weex

 

二、修改【webpack.config.js】配置文件
找到 /\.js$/的rules,進行修改函數

 

{
        test: /\.js$/, use: [{ loader: 'babel-loader', options: { presets: ['es2015'] } }] }

 

三、根目錄下添加【.babelrc】文件
文件內容:

 

{
  "presets": ["es2015"] }
差很少效果是這樣的:

下面也不知道會有了那麼多東西,就這樣用吧

{
  "presets": [
    ["env", {
      "modules": false,
      "targets": {
        "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
      }
    }],
    "stage-2"
  ],
  "plugins": ["transform-vue-jsx", "transform-runtime"]
}

4.運行項目時報錯 Error: No PostCSS Config found in... 

 有時候clone下來的項目安裝運行後會報這個錯誤,解決方法:

在項目根目錄新建postcss.config.js文件,並對postcss進行配置:

module.exports = {  
    plugins: {  
      'autoprefixer': {browsers: 'last 5 version'}  
    }  
  }

 在npm run dev 就行了。postcss配置在 webpack.config.js   postcss.config.js是針對webpack3.0作的特殊處理。

5.Vue渲染table時調用方法修改data屬性的時候報錯:You may have an infinite update loop in a component render function. 

<template>
    <div>
      <el-table :data="tableData" >
            <el-table-column prop="id" label="id"></el-table-column>
            <el-table-column prop="createTime" label="建立時間">
                <template slot-scope="scope">
                    <span>{{testt('1s1')}}</span>
                </template>
            </el-table-column>
        </el-table> 
    </div>
</template>
<script> export default { data() { return { num:0, tableData:[{id:1,createTime: "2019-03-05"}] }; }, methods: { testt(){ this.num = this.num+1 console.log(this.num+1) }, deleteRow(){ alert(1) } }, }; </script>

在循環渲染列表的時候(v-for也是如此)同時改變data屬性的值就會報錯:

緣由:渲染組件的時候,去改變了data裏面的數據,data裏面的數據變化又會調用render函數,重新渲染組件,這樣就形成了 死循環

相關文章
相關標籤/搜索