3

我正在尝试使用 sass-loader 将我们的 SASS 构建从 gulp + node-sass 移动到 webpack。

作为参考，gulp + node-sass 3.2 给了我们大约 2.5-3 秒的构建时间。

在 webpack 中，如果我使用 style!raw!sass 进行加载，我正在查看 10~ 第二次构建，并且没有源映射（因为原始加载程序）。如果我让 sourcemaps 的 css 加载器工作，额外的解析会使构建在美好的一天需要 20-30 秒。

我想知道我可以使用什么技巧来改进事情。现在我能做的最好的事情就是将我们的 sass 编译拆分为从 javascript 到 SASS 的大量 require(...)，然后将它们连接到一个文件中。使用 -watch 选项，允许进行一些虚假增量编译，因此在初始构建之后，它还不错。

我想知道除此之外我还能做些什么来让它变得更好。比 gulp + nodeass 慢 10 倍不是很好，但是拥有 2 个构建工具也不是很好（webpack 对 JS 工作 100% 好，即使有大量代码）

4

1 回答 1

0

请看这篇很棒的文章，关于 webpack、预处理器、源映射和构建速度： http ://eng.localytics.com/faster-sass-builds-with-webpack/

我目前正在将 sass-loader 与 node-sass（和 libsass）、cssmodules（具有分离的样式表，每个组件/容器一个）、内联 sourceMaps 和 HMR 一起使用。使用更新的样式重新加载修改后的组件需要 2-3 秒。

您可以在这里看到一个配置示例： https ://github.com/erikras/react-redux-universal-hot-example/blob/master/webpack/dev.config.js

于 2016-03-12T23:42:17.027 回答