1. 程式人生 > >vue筆記(二)vue專案整合element-ui-全域性

vue筆記(二)vue專案整合element-ui-全域性

開啟vue專案,推薦使用webstorm,在如圖位置輸入命令:


1. 安裝 loader 模組:

npm install style-loader -D

npm install css-loader -D

npm install file-loader -D

2. 安裝 Element-UI 模組:

npm install element-ui --save

3.修改 build/webpack.base.conf.js 的配置:

      {
        test: /\\\\\\\\.css$/,
        loader: "style!css"
      },
      {
        test: /\\\\\\\\.(eot|woff|woff2|ttf)([\\\\\\\\?]?.*)$/,
        loader: "file"
      }

4. src/main.js內引入,如圖:


import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

5.直接在vue檔案內使用即可,如圖:


注:順道記下怎麼下載router:

npm i vue-router -D

下載xvue:

npm install vuex -S
下載axios:
npm install axios -S

安裝Echarts

npm install echarts -S