vue中px轉(zhuǎn)換成rem的設(shè)置

2018年02月24日 18:05:51

閱讀數(shù)：756

1.npm install px2rem --save-dev

2.在utils.js中加入

const px2remLoader = {loader:'px2rem-loader',options: {remUnit:40? ? }}

并修改下面代碼

function generateLoaders (loader, loaderOptions) {const loaders = options.usePostCSS ? [cssLoader,postcssLoader,px2remLoader] : [cssLoader,px2remLoader]if (loader) {loaders.push({loader: loader +'-loader',options:Object.assign({}, loaderOptions, {sourceMap: options.sourceMap? ? ? })? ? })? }

3.如此變可以在vue中直接書(shū)寫(xiě)px,會(huì)自動(dòng)轉(zhuǎn)換成rem。

4.當(dāng)需要引入外部css文件時(shí)，用@import時(shí)會(huì)出現(xiàn)不能轉(zhuǎn)換的情況(待解決)，可以直接在script中import