Vue.js 是比較流行的一個(gè)前端 JS 框架，Github 上有不少基于它的開源腳手架項(xiàng)目。因?yàn)楣ぷ餍枰?，?github 的某個(gè)個(gè)vue 項(xiàng)目導(dǎo)入 IDEA 后，打開工程目錄，發(fā)現(xiàn)各種標(biāo)紅的代碼，但是工程能正確啟動(dòng)。
本文記錄去掉這些錯(cuò)誤提示的過程，根源是 IDEA 環(huán)境配置不識(shí)別的問題，IDEA 識(shí)別的有問題的文件，它的顏色跟正常文件顏色都不一樣，是紅色的，普通文件名顯示紅色，js 直接用紅色波浪線標(biāo)紅了。
0、cnpm
模塊管理工具 npm ，通常在下載模塊時(shí)很慢，此時(shí)應(yīng)該用國內(nèi)的鏡像，安裝 cnpm 后使用 cnpm 工具：
npm（node package manager）：nodejs的包管理器，用于node插件管理（包括安裝、卸載、管理依賴等）
cnpm:因?yàn)閚pm安裝插件是從國外服務(wù)器下載，受網(wǎng)絡(luò)的影響比較大，可能會(huì)出現(xiàn)異常，如果npm的服務(wù)器在中國就好了，所以我們樂于分享的淘寶團(tuán)隊(duì)干了這事。
來自官網(wǎng)：“這是一個(gè)完整 npmjs.org 鏡像，你可以用此代替官方版本(只讀)，同步頻率目前為 10分鐘 一次以保證盡量與官方服務(wù)同步?！?/span>
安裝 cnpm 的方法：
npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm install moduleName
具體表現(xiàn)如下：
1、Vue 文件中屬性標(biāo)簽不識(shí)別
在一個(gè) div 中有一個(gè)事件配置，但是 IDEA 標(biāo)紅，提示錯(cuò)誤為：“Attribute @click is not allowed here ”。點(diǎn)擊左側(cè)電燈泡，提供了解決該錯(cuò)誤的方法。
2、復(fù)制錯(cuò)誤信息
IDEA 的錯(cuò)誤信息，不能直接在提示的地方復(fù)制，會(huì)跑掉。但是可以在底部狀態(tài)欄那里右鍵 “copy” 來復(fù)制。
錯(cuò)
scss 文件的嵌套樣式定義語句，會(huì)被 IDEA 提示 ‘{’ expected ：
<style lang="scss" scoped>.app-breadcrumb.el-breadcrumb { display: inline-block; font-size: 14px; line-height: 50px; margin-left: 8px; .no-redirect { color: #97a8be; cursor: text; }}
解決辦法，在定義時(shí)設(shè)置 rel 屬性：
<style lang="scss" rel="stylesheet/scss" scoped>
4、ESLint 校驗(yàn)提示
錯(cuò)誤提示是 ESlint 插件的語法問題，比如：ESLint: Extra semicolon. (semi) ，可以用快速解決方法，定位到該錯(cuò)誤前面的紅色電燈泡那里：
點(diǎn)擊“Fix current file with ESLint” 可以直接修正這種簡單錯(cuò)誤。
5、IDEA 版本
本地一直使用 IDEA2016 年的版本，它有一個(gè)漏洞，就是將本機(jī)時(shí)間調(diào)到將來某一天后，打開時(shí)就能延長試用期限?？偢杏X IDEA 的激活碼很難找，所以一直沒有更換版本，導(dǎo)入 vue 項(xiàng)目才發(fā)現(xiàn)低版本對(duì)很多技術(shù)沒有辦法兼容了，前面的 scss 語言的支持，在高版本中其實(shí)是能識(shí)別的。
下載了一個(gè) 2019.3 版本，隨便搜了一個(gè)激活碼就好了，工具就弄好了，真的很 簡單的。被自己的固步自封給坑了好幾年！
版權(quán)聲明：本文內(nèi)容由互聯(lián)網(wǎng)用戶自發(fā)貢獻(xiàn)，該文觀點(diǎn)僅代表作者本人。本站僅提供信息存儲(chǔ)空間服務(wù)，不擁有所有權(quán)，不承擔(dān)相關(guān)法律責(zé)任。如發(fā)現(xiàn)本站有涉嫌抄襲侵權(quán)/違法違規(guī)的內(nèi)容， 請(qǐng)發(fā)送郵件至 舉報(bào)，一經(jīng)查實(shí)，本站將立刻刪除。