1.用npm装包时
-D表示是开发环境所依赖的东西，配置在package.json中的devDependencies下，生产环境不需要这些东西，比如一些编译打包工具。
-S表示生产环境仍然需要这些东西，配置在package.json中的dependencies下，比如项目所依赖的框架，JQ，VUE，vue-router等。
2. 在vue-cli中使用sass
1.安装对应的模块
npm install node-sass --D
npm install sass-loader --D
2.打开webpack.base.config.js在loaders里面加上
{
test: /\.scss$/,
loaders: ["style", "css", "sass","scss"]
}，
3.在用到sass的style标签内写上 lang=scss。
3.引入公共的sass变量基础
1.添加依赖
npm install sass-loader node-sass --save
npm install sass-resources-loader --save
2.修改build/utils.js下的return中的scss
scss: generateLoaders('sass').concat(
{
loader: 'sass-resources-loader',
options: {
resources: path.resolve(__dirname, '你要引入的公共sass路径')
}
}
)
4.px转换rem
1、安装postcss-px2rem
npm install postcss-px2rem --save
2、配置px2rem
在配置文件build目录下vue-loader.conf.js中增加
module.exports = {
loaders: utils.cssLoaders({
sourceMap: isProduction
? config.build.productionSourceMap
: config.dev.cssSourceMap,
extract: isProduction
}),
postcss: [
require('postcss-px2rem')({'remUnit':75}) //75转换比值
]
}，
3.引入淘宝自适应JS
npm i lib-flexible --save
在main.js中import。
