1.SCSS 配置
1.1 npm install sass-loader --save-dev
1.2 npm install node-sass --sava-dev
1.3 webpack.base.conf.js的rules配置
{
test: /.scss$/,
loaders: ['style', 'css', 'sass']
}
2.mint-ui
cnpm install mint-ui -S
3.element-ui
cnpm i element-ui -S
4.vuex
vuex cnpm install vuex --save
5.router
vue路由配置:
1.安装
npm install vue-router --save //cnpm install vue-router
2.在main.js引入并且 使用
import VueRouter from 'vue-router'
Vue.use(VueRouter)
3.配置路由
3.1 创建组件 引入组件
3.2 定义路由(建议复制)
const routes = [
{path:'/foo',component:Foo},
{path:'/bar',component:Bar},
{path:'',redirect:'/foo'} //默认跳转路由
]
3.3 实例化 VueRouter
const router = new VueRouter({
routers// (缩写) 相当于routers:routes
})
3.4 挂载
new Vue({
el:"#app",
router,
render:h=> h(App)
})
3.5 根组件的模板里边使用
<router-view></router-view>
3.6 路由跳转
<router-link to="/foo"> Go to Foo</router-link>
<router-link to ="/bar"> Go to Bar </router-link>
6. qs库
qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库。
npm install qs
7搭建vue的开发环境:
https://cn.vuejs.org/v2/guide/installation.html
1、必须要安装nodejs
2、搭建vue的开发环境 ,安装vue的脚手架工具 官方命令行工具
npm install --global vue-cli / cnpm install --global vue-cli (此命令只需要执行一次)
3、创建项目 必须cd到对应的一个项目里面
vue init webpack vue-demo01
cd vue-demo01
cnpm install / npm install
如果创建项目的时候没有报错,这一步可以省略。如果报错了 cd到项目里面运行
npm run dev
4、另一种创建项目的方式 (推荐) ***
vue init webpack-simple vuedemo02
cd vuedemo02
cnpm install / npm install
npm run dev