搭建后台elementui框架要引入的包

1初始化webpack和vue-router

vue init webpack projectName
//里面选中vue-router,不选中测试和eslint

2安装axios和vuex

cnpm install --save axios
cnpm install --save vuex

3引入elementui

cnpm i  --save  element-ui

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' (根据版本路径不同会有差异，按照自己版本路径)
Vue.use(ElementUI)

4.运行和打包

npm run dev
npm run build

5.引入sass

需要引入下面两个，sass-loader依赖于node-sass
npm install --save-dev sass-loader
npm install --save-dev node-sass

然后在build文件夹下的webpack.base.conf.js的rules里面添加配置：
{
  test: /\.sass$/,
  loaders: ['style', 'css', 'sass']
}
<style lang="scss"></style>

会报错，不知道啥原因，查看了下sass-loader版本是8.0.0,我将其改为旧版本7.3.1
1.将package.json中的sass-loader修改成7.3.1
2.将安装的node_modules项目依赖删除，重新安装，将sass-loader版本变成7.3.1
3.重新运行项目 npm run dev
4.问题解决，并不会报错

更多详细请参考下面链接： www.jianshu.com/p/22d8a43c0…

6.引入less

//sass或者less用一种就可以了。
cnpm install less less-loader --save-dev
<style lang="less"></style>

7.引入normalize.css

npm i normalize.css --save
import 'normalize.css'

有时候会报错，原因没有安装：css-loader   和style-loader
npm install css-loader style-loader
但是有时候不安装也可以。。。

更多详细请参考下面链接： www.jianshu.com/p/9d7ff8975…

其他选择引入的：

8.引入animate.css

npm install animate.css --save
import animated from 'animate.css'
Vue.use(animated)
一般搭配jquery使用比较方便

9.jquery

cnpm install jquery --save

安装好之后，需要进行配置

详细请参考： www.jianshu.com/p/8118f7f52…