vue 项目优化

去除冗余的css

消除框架中未使用的CSS,初步达到按需引入的效果
使用背景：vue2.x, webpack3.x
使用插件：purifycss-webpack

安装：

npm i purifycss-webpack purify-css glob-all -D

安装后各个插件的版本：
“glob-all”: “^3.3.1”,
“purify-css”: “^1.2.5”,
“purifycss-webpack”: “^0.7.0”,

使用：
在 \build\webpack.prod.conf.js

const PurifyCSSPlugin = require('purifycss-webpack');
const glob = require('glob-all');

plugins: [
	new PurifyCSSPlugin({
	  paths: glob.sync([
	    path.join(__dirname, '../index.html'),
	    path.join(__dirname, '../src/**/*.vue')
	    //注意：这里要写上所有用到css的地方
	  ])
	})
]

打包后效果：
原大小：

使用后：

页面效果一切正常，不过随便在vue文件里定义的，没有用到的一些css，并没有被删除掉
官网：
PurgeCSS 中文文档
PurifyCSS Plugin

还有个去除css的插件是purgecss-webpack-plugin，但是使用一直不成功，暂时没有办法解决，可能和node版本有关