vue项目引入vux-ui框架详解(快速入门)

一、新建自带vux框架的vue项目(免配置)

1、安装vue环境 (已安装,跳过这一步)

2、新建基于vux的vue项目;

vue init airyland/vux2 projectName     //(新建项目配置已省略)       
cd projectName        //(新建成功后切换到项目根目录下)
npm install --registry=https://registry.npm.taobao.org 
npm run dev

二、在已有的vue项目引入vux框架

1、安装vux

npm install vux --save

2、安装vux-loader、less、less-loader、yaml-loader

npm install vux-loader less less-loader yaml-loader --save-dev

3、build/webpack.base.conf.js配置

配置前:

vue项目引入vux-ui框架详解(快速入门)_第1张图片

配置后:

vue项目引入vux-ui框架详解(快速入门)_第2张图片

4、App.vue里引入reset 

vue项目引入vux-ui框架详解(快速入门)_第3张图片

重启项目

三、测试

1、引入vux组件,查看vux组件库了解更多

vue项目引入vux-ui框架详解(快速入门)_第4张图片

2、实现效果

vue项目引入vux-ui框架详解(快速入门)_第5张图片

(完)

你可能感兴趣的:(☛,Vux-UI,☛,Vue.js)