vue-cli使用flexible
以前项目上用到这个,网上教程很多,但是说法都不一样,自己总结的,如果有不对的地方可以提出来,
vue-cli flexible
1、index.html引入flexible
<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/??flexible_css.js,flexible.js"></script>
<script src="http://g.tbcdn.cn/mtb/lib-flexible/0.3.4/makegrid.js"></script>
2、安装依赖
npm install postcss --save
npm install postcss-loader --save
npm install postcss-px2rem --save
3、build里面修改vue-loader.conf.js文件
var utils = require('./utils')
var config = require('../config')
var isProduction = process.env.NODE_ENV === 'production'
module.exports = {
loaders: utils.cssLoaders({
sourceMap: isProduction ?
config.build.productionSourceMap : config.dev.cssSourceMap,
extract: isProduction
}),
preserveWhitespace: false,
postcss: [
require('autoprefixer')({
browsers: ['last 3 versions'],
remove: false
}),
require('postcss-px2rem')({
remUnit: 75
})
]
}
4、字体大小直接用px
/*px*/ 自动生成适应屏幕的大小
/*no*/ 不修改。显示原有大小
本文来自「青年码农」公众号,作者:青年码农,转载请注明原文链接:https://www.cnblogs.com/nmgwap/p/16331759.html