webpack px2rem

Question

用vue做的web端开发，然后其中有一个预览页面需要转换为rem供移动端使用，请问下webpack该如何配置呢？

`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
    })
  })
}

// Extract CSS when that option is specified
// (which is the case during production build)
if (options.extract) {
  return ExtractTextPlugin.extract({
    use: loaders,
    fallback: 'vue-style-loader',
    publicPath: '../../'
  })
} else {
  return ['vue-style-loader'].concat(loaders)
}

}

return {

css: generateLoaders(),
postcss: generateLoaders(),
less: generateLoaders('less'),
sass: generateLoaders('sass', { indentedSyntax: true }),
scss: generateLoaders('sass'),
stylus: generateLoaders('stylus'),
styl: generateLoaders('stylus')

}`

现在这样配置了导致所有页面都进行了px转rem,导致web端看到的样式变小了，有什么办法让其中某一个页面比如render.vue进行rem转换而其他页面不转呢？还是说有什么其他思路请各位指点指点3Q

Answer 1

webpack不是可以配置end指定某个文件引用吗