webpack2 autoprefixer开发时生效 发布却不生效

为什么在开发的时候会自动添加css3前缀,但打包发布却没有加上,我的配置问题出在哪? 另外有没有办法把vue组件里的样式提出来,跟js一样按需加载

module.exports = {
  entry: {
    main:'./src/main.js',
  },
  module: {
    rules: [
      {
        test: /\.vue$/,
        loader: 'vue-loader',
        options: {
        }
      },
    ]
  },
  resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
    }
  },
  plugins:[

  ]
}

if(process.env.NODE_ENV === 'development')
{
  module.exports.module.rules.push(
    {
        test: /\.css$/,
        loader:'style-loader!css-loader!postcss-loader'
    }
  );

}


if (process.env.NODE_ENV === 'production') {

  module.exports.module.rules.push(
    {
        test: /\.css$/,
        use:  ExtractTextPlugin.extract({ fallback: 'style-loader', use: ['css-loader','postcss-loader'] })
       
    }
  );

  module.exports.plugins = (module.exports.plugins || []).concat([
    new ExtractTextPlugin('./css/[name][contenthash:6].min.css'),
  ])
}

这是postcss.config

module.exports = {
  plugins: [
    require('autoprefixer')({
                    browsers: ["last 2 versions","Firefox 15","ie > 10","Safari >= 6"]
                })
  ]
}
阅读 2k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题