Babel / React - 将scss / sass导入转换为css导入

Question

我有React项目，我使用.scss样式文件。我想知道是否可以更改（使用babel？）。scss导入.css导入。

目前：

import './MyStylesFile.scss';

预期：

import './MyStylesFile.css';

然后原因是，我没有什么用户，f.e。使用webpack时强制使用sass-loader。

Answer 1

也许babel-plugin-transform-rename-import可以为您提供帮助。你可以在babel.rc

中使用它

{
  ...,
  "env": {
    "production": {
      "plugins": [
        ["transform-rename-import",
         { "original": "./MyStylesFile.scss", 
           "replacement": "./MyStylesFile.css"
         }],
      ]
    }
  }
}

此外，它支持更复杂的用例的正则表达式。 确保树中的env与您编译的env匹配。