Vue.js 是比較流行的一個前端 JS 框架，Github 上有不少基於它的開源腳手架專案。因為工作需要，將 github 的某個個vue 專案匯入 IDEA 後，開啟工程目錄，發現各種標紅的程式碼，但是工程能正確啟動。

本文記錄去掉這些錯誤提示的過程，根源是 IDEA 環境配置不識別的問題，IDEA 識別的有問題的檔案，它的顏色跟正常檔案顏色都不一樣，是紅色的，普通檔名顯示紅色，js 直接用紅色波浪線標紅了。

模組管理工具 npm ，通常在下載模組時很慢，此時應該用國內的映象，安裝 cnpm 後使用 cnpm 工具：

npm（node package manager）：nodejs的包管理器，用於node外掛管理（包括安裝、解除安裝、管理依賴等）cnpm:因為npm安裝外掛是從國外伺服器下載，受網路的影響比較大，可能會出現異常，如果npm的伺服器在中國就好了，所以我們樂於分享的淘寶團隊幹了這事。來自官網：“這是一個完整 npmjs.org 映象，你可以用此代替官方版本(只讀)，同步頻率目前為 10分鐘 一次以保證儘量與官方服務同步。”

安裝 cnpm 的方法：

npm install -g cnpm --registry=https://registry.npm.taobao.org cnpm install moduleName

具體表現如下：

在一個 div 中有一個事件配置，但是 IDEA 標紅，提示錯誤為：“Attribute @click is not allowed here ”。點選左側電燈泡，提供瞭解決該錯誤的方法。

IDEA 的錯誤資訊，不能直接在提示的地方複製，會跑掉。但是可以在底部狀態列那裡右鍵 “copy” 來複制。![在這裡插入圖片描述](https://img-blog.csdnimg.cn/20191207070532751.png

scss 檔案的巢狀樣式定義語句，會被 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;  }}

解決辦法，在定義時設定 rel 屬性：

<style lang="scss" rel="stylesheet/scss" scoped>

錯誤提示是 ESlint 外掛的語法問題，比如：ESLint: Extra semicolon. (semi) ，可以用快速解決方法，定位到該錯誤前面的紅色電燈泡那裡：

本地一直使用 IDEA2016 年的版本，它有一個漏洞，就是將本機時間調到將來某一天後，開啟時就能延長試用期限。總感覺 IDEA 的啟用碼很難找，所以一直沒有更換版本，匯入 vue 專案才發現低版本對很多技術沒有辦法相容了，前面的 scss 語言的支援，在高版本中其實是能識別的。

下載了一個 2019.3 版本，隨便搜了一個啟用碼就好了，工具就弄好了，真的很 簡單的。被自己的固步自封給坑了好幾年！