如何自动更新相关的CSSpath缩小？

我想更新所有相对path的缩小，因为我为每个JS / CSS组件使用单独的文件夹，并且每个组件的文件夹深度也可能不同，例如：

 css/ style.min.css // final minified and processed file common.scss components/ gallery/ gallery.scss // url(../../../img/mypic.png) img/ mypic.png 

在缩小之后，我在style.min.css样式仍然会有../../../img/mypic.png 。 但是，它必须更新到../img/mypic.png ，否则webbrowsers不会find图片。

我怎样才能自动使用PostCSS或其他包？

我发现postcss-url项目，它提供了一个自定义URL转换的function，但我没有find任何示例如何做到这一点。

现在我使用nodejs ， nodejs ， autoprefixer和postcss来postcss我的postcss 。

Answer 1

在postcss-url中有一个名为url的参数，可以用来将自定义函数传递给postcss-url 。 这个函数可以修改postcss-url ，但是这个代码必须手工编写。 这是我在我的项目中使用的：

 var outDir = './src/css'; // output folder for CSS gulp.task('min:css', function () { return gulp .src(cssInput) .pipe(postcss([ autoprefixer(), postcssurl({ // this function will modify URLs url: function (asset) { if (!asset.url || asset.url.indexOf("base64") !== -1) { return asset.url; } return path.relative(outDir, asset.absolutePath).split("\\").join("/"); } }) ])) ... });