一 、vue安裝的坑
報錯時的常見問題
1、cnpm install 模塊名 –save-dev(關於環境的，表現為npm run dev 啟動不了)cnpm install 模塊名 –save(關於項目的，比如main.js，表現為npm run dev 成功之后控制台報錯)比如escape-string-regexp、strip-ansi、has-ansi、is-finite、emojis-list/2.
2、報如下錯，表示端口錯誤，關掉相關頁面，重新啟動！！！
3、啟動項目的時候會出出現加載那些文件進程，這時候可以通過設置package.json文件
4、打包編譯（cnpm run dev），只需要提交dist文件
后端那邊配置路徑只需要映射到dist里面的index文件！！！！！！
5.在用scss編輯的時候，引用路徑的坑
二、swiper安裝的坑
1.swiper 安裝
npm install swiper --save
2.然后在static引入樣式
3 .vue文件引入
require('../../../static/swiper.min.css')
import Swiper from 'swiper' //用npm安裝的，要用的時候，需要用import引入！！！！！！
mounted (){
setTimeout(() => {
var mySwiper = new Swiper('.swiper-container', {
autoplay: true,//可選選項，自動滑動
})
}, 400)
},
注意在vue中需要用setTimeout(function(){},400),不然swiper不會自己輪播！！！！！
三、進行雙向數據綁定的時候，使用false來控制顯示隱藏，發現失效，經檢查發現，是因為在切換的時候，給false和true加雙引號了，以至於賦值的是賦值string類型而不是boolen類型
打印出來
isActive要是布爾值，字符串就會失效
四、在進行父子組件相互通訊的時候，利用布爾值控制不同元素的顯示隱藏，值得注意的是父組件傳給子組件的布爾值
子組件接收的時候是限制布爾值，所以這時候父組件這邊傳過來的是布爾值，要是不傳或者所傳不是布爾值類型，則子組件使用的是默認值，當所傳不是布爾值是會警告！！！
父組件異步獲取的數據，想傳遞給子組件使用，然后在子組件中獲取數據，會報如下的錯誤
解析：子組件的html中的{{childData}}的值會隨着父組件的值而改變，但是created里面的卻不會發生改變(生命周期問題)
http://www.jb51.net/article/117447.htm
五、常見報錯
vue中，假如，你引入某個樣式，然后這個樣式里面有引用到圖片，如果你的文件中沒有這個圖片，這時候，即使你沒有引用這個圖片對應的類名，但是只要你有引入這個css文件，他找不到相應路徑圖片也會報錯！！！
六、在<router-link></router-link>中使用v-for="(item ,index) in list"進行循環時，需要注意加：:key=“index”,不然會出現警告！！
<router-link v-for="(item ,index) in list" :key="index" ></router-link>
七、路由跳轉錯誤
跳轉路由后，發現http://localhost:8085/mall/detail/202路徑會自動跳轉http://localhost:8085空白頁，排查原因后，發現detail中引入的組件報錯
八、圖片引用錯誤
在vue中的html中的img中的src不可以直接設置為變量，在data里面直接引路徑，只能通過import的形式引入,值得注意的是，引用這個方式的時候src是變量需要加“：”，不然會報錯！！！！！
<img :src="imgSrc">
import imgSrc from '../../assets/consult/head1.png '
data() {
return {
imgSrc:imgSrc
}
}
九：用for循環出來的列表，在設置列表中的元素的動態屬性時，需要加bind屬性“：”，不然動態屬性設置不出來
十：父組件ajax異步更新數據，子組件props獲取不到
應用場景
當父組件 axjos 獲取數據，子組件使用 props 接收數據時，執行 mounted 的時候 axjos 還沒有返回數據，而且 mounted 只執行一次，這時 props 中接收的數據為空
解決方案：在對應組件中判斷數據的長度
<recommend :recommend="recommendList" v-if="recommendList.length"></recommend>
十一：當出現如下警告時
WARNING in ./node_modules/api/activity.js There are multiple modules with names that only differ in casing.
排查原因:（這個是表示大小寫寫錯了）
1 、在引用組件時，路徑大小寫不對也會造成此報錯，看例子：
錯誤寫法：
import Footer from '../components/Shared/footer.vue'
正確寫法：
import Footer from '../components/shared/footer.vue'