1.使用vue-cli新建一個(gè)vue項(xiàng)目
npm install -g vue-cli
vue init webpack project
2.安裝vux所需依賴(lài)
npm install vux --save
npm install vux-loader --save-dev
//編譯less源碼
npm install less less-loader --save-dev
//安裝 yaml-loader 以正確進(jìn)行語(yǔ)言文件讀取
npm install yaml-loader --save-dev
3.在build/webpack.base.conf.js文件中添加如下配置:
// 原來(lái)的module.exports = {}配置
let webpackConfig = {}
const vuxLoader = require('vux-loader')
module.exports = vuxLoader.merge(webpackConfig, {
plugins: [
'vux-ui',
'progress-bar',
{
name: 'duplicate-style',
options: {
cssProcessorOptions : {
safe: true,
zindex: false,
autoprefixer: {
add: true,
browsers: [
'iOS >= 7',
'Android >= 4.1'
]
}
}
}
}
]
})
4.安裝優(yōu)化插件
4.1在webpack.base.conf.js添加, 可以在構(gòu)建后去除重復(fù)css代碼(通過(guò)配置vux-loader實(shí)現(xiàn)操骡,步驟三中代碼已加入)
plugins: [{
name: 'duplicate-style'
}]
4.2安裝fastclick纵寝,移除移動(dòng)端點(diǎn)擊延遲
npm install fastclick -S
//在main.js中引入
import FastClick from 'fastclick'
FastClick.attach(document.body);