搭建vue框架(二)：項目配置

使WebStorm識別路徑別名

使用WebStorm時，別名@符號無法識別，ctrl+鼠標左鍵無法跳轉

解決方法

使WebStorm跳轉關聯ElementUI

使用WebStorm時，ctrl+鼠標左鍵無法從標籤跳轉到Eelment內部

解決方法： 添加element庫

安裝ElementUI

npm i element-ui -S

main.js中使用

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'; // 默認主題
// import './assets/css/theme-green/index.css'; // 淺綠色主題

Vue.use(ElementUI)

安裝babel

ie9和一些低版本的高級瀏覽器對es6新語法並不支持
使用babel可以解決

npm i babel-polyfill -D

// main.js中引入
import 'babel-polyfill';

禁用ESLint

在vue.config.js中配置 (重啓生效)
配置後，還是會檢查，會有紅線，但是不影響啓動

module.exports = {
  lintOnSave: false 
}

配置ESLint規則

// .eslintrc.js
module.exports = {
  root: true,
  env: {
    node: true
  },
  extends: [
    'plugin:vue/essential',
    '@vue/standard'
  ],
  parserOptions: {
    parser: 'babel-eslint'
  },
  rules: {
    semi: ['error', 'always'], // 強制有分號，沒有就報錯
    'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
    'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
  }
};