vue中px轉換成rem的設定
阿新 • • 發佈:2018-12-23
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中直接書寫px,會自動轉換成rem。
4.當需要引入外部css檔案時,用@import時會出現不能轉換的情況(待解決),可以直接在script中import