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

Leo*_*zes 9 reactjs node-sass windows-subsystem-for-linux

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

Linux/macOS和Windows之间的脚本很痛苦,因此我们决定使用Bash for Windows来运行我们的构建.一旦你正确设置Bash,这很有效,并且与VS Code的集成非常好. 但是有一个很大的问题:每当你想要在Bash之外更新你的项目时(使用CMD或PowerShell),你就可以有效地切换你的操作系统,然后你从node-sass那里得到一个很好的错误,说你的环境有改变.

由于重建节点,青菜根本不会工作的,我们已经找到了唯一的办法摆脱这个问题被删除或重命名的node_modules和运行npm install一遍,但它是非常的时间/消耗资源.

我们已经看到它看起来有一个原生的js替代品,但我们想看看是否有人经历过相同的并找到了合适的解决方案.

我们真的没有大量的SASS文件,所以我们不太关心性能(这是使用libSass在C++中实现它的主要观点).

:我们不能总是用猛砸在Windows上,因为我们有一些Java /有些凌乱的Maven集成阵营运行NPM构建的应用程序,这将永远是在Windows中.

dnl*_*.re 1

我们在应用程序中使用 Angular 6 前端并遇到了同样的问题。我们通过将所需的二进制文件签入存储库并使用不同的 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>
Run Code Online (Sandbox Code Playgroud)