reactjs - 在 React 项目中用与平台无关的 SASS 编译器替换 node-sass

Question

我们是一个由大约 6 名开发人员组成的团队，具有异构设置(Windows 10、Ubuntu、macOS)，并已开始使用 React 进行开发。

Linux/macOS 和 Windows 之间的脚本编写非常痛苦，因此我们决定使用 Bash for Windows 来运行我们的构建。一旦您正确设置了 Bash，这就会非常有效，并且与 VS Code 的集成也很棒。 但是有一个很大的问题:每当你想在 Bash 之外更新你的项目(使用 CMD 或 PowerShell)时，你实际上是在切换你的操作系统，然后你会从节点收到一个很好的错误-sass 说 your environment has changed 。

由于重建node-sass根本不起作用，我们发现解决这个问题的唯一方法是删除或重命名node_modules并再次运行npm install，但这非常消耗时间/资源。

我们已经看到它看起来像 there is a native js alternative但我们想看看是否有人经历过同样的事情并找到了合适的解决方案。

我们确实没有大量的 SASS 文件，因此我们不太关心性能(这是使用 libSass 在 C++ 中实现这一点的要点)。

注意:我们不能总是在 Windows 上使用 Bash，因为我们在一些运行 npm 构建的 Java/React 应用程序中进行了一些困惑的 Maven 集成，而这将始终在 Windows 中。

Answer 1

我们在应用程序中使用 Angular 6 前端并遇到了同样的问题。我们通过将所需的二进制文件 checkin 存储库并使用不同的 Maven 配置文件(每个环境/操作系统一个，对于我们的 CI 来说默认是 linux)来将 sass-binary-path 设置为其环境特定的二进制文件来解决这个问题。但是，只有当您拥有能够设置环境变量的构建系统时，它才有效。另一个警告是您必须手动更新二进制文件。

<properties>
    <sass.binary.path.base>${basedir}/node-sass-binaries/</sass.binary.path.base>
</properties>
...
<profile>
  <id>linux</id>
  <activation>
    <activeByDefault>true</activeByDefault>
  </activation>
  <properties>
    <sass.binary.path>${sass.binary.path.base}/linux-x64-64_binding.node</sass.binary.path>
  </properties>
</profile>
<profile>
  <id>windows</id>
  <properties>
    <sass.binary.path>${sass.binary.path.base}/win32-x64-64_binding.node</sass.binary.path>
  </properties>
</profile>
<profile>
  <id>mac</id>
  <properties>
    <sass.binary.path>${sass.binary.path.base}/darwin-x64-64_binding.node</sass.binary.path>
  </properties>
</profile>