Jinjiang/px2rem-loader

后面跟less-loader,加上UglifyJsPlugin的一个bug

Closed this issue · 6 comments

var webpack = require('webpack');
module.exports = {
	module: {
		loaders: [
			{ test: /\.less$/, loader: "css!px2rem?remUnit=64&remPrecision=8!less?compress&noJs" }
		]
	},
    plugins: [new webpack.optimize.UglifyJsPlugin({
        compress: {
            warnings: false
        },
        comments: 'all'
    })
    ]
}

index.less:

/* this is file.less */
body {
	color: #fff;
	height: 200px; /*no*/
}

height的200px不应该转为rem的,但是还是被转成了px。

我试着去掉UglifyJsPlugin或者less-loader,就可以work....

我这边暂时没有机会重现,会不会是 uglify 之后注释的格式不被识别了?你是否方便看一下 uglify 之后的中间码是什么样子的?
不方便的话我晚些时候自己试试看
谢谢

@Jinjiang 不客气,请问如何查看uglify之后的中间码?

另外为了方便重现,我把我的demo文件传到云上,以供下载查看~

https://pan.baidu.com/s/1ge8OUOj

有一种简单的方法是在 px2rem-loader/lib/px2rem-loader.js 里把 source 打印出来
这里的 less 文件经过转换之后已经变成了 body{transform:translate(0, 0);height:200px},应该是你加入了 uglify 插件之后,CSS 里的注释也被丢掉了,所以 /* no */ 的标识没有被发现。

恩,但是生产环节打包需要用uglify啊。。。。我在uglify里面选项里面设置注释保留还是有这个问题。不知道有没有解决办法?

想办法找个能压缩 js 的 loader 吧,放到 px2rem-loader 和 css-loader 之间,不要用 plugin

好吧,有机会我试一试,这个issue先关了