我正在使用create-react-app引导我的应用程序，我想使用Typescript和SASS进行开发。我一直在使用Angular，在这里我可以像这样轻松地引用SASS文件：
@Component({
selector: 'unit-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'],
providers: []
})
在React中，我试图像这样导入SASS文件：
import s from "./mystyles.scss";
但是我得到了错误
找不到模块“ ./mystyles.scss”
。如何将SASS文件导入.tsx文件？
假设您已成功安装node-sass在TypeScript create-react-appReact应用程序中，就像通过执行以下操作添加/导入CSS样式表一样：
import './mystyles.css';
对于SCSS样式表，您只需更改文件类型：
import './mystyles.scss';
在您的示例中，您仅需要将其视为仅具有副作用的导入模块，而不是像您当前正在尝试的那样将其视为默认导入。
您还可以通过将SCSS文件名更新为并导入，如下所示将其视为SCSS模块mystyles.module.scss：
import styles as './mystyles.module.scss';
由于能够在[email protected]更高版本的项目中默认内置Sass / SCSS支持，因此我能够实现以下两项功能：
npx create-react-app my-app --template typescriptnpm install --save node-sassApp.css为App.scssApp.tsx从更改import './App.css';为import './App.scss';确保已node-sass安装。如果这样做没有帮助，则可能需要重新查看如何create-react-app在TypeScript中创建/转换您的代码。
您需要将其导入为import './mystyles.scss';或实际放入module文件名并将其导入为import whatever from './mystyles.module.scss';。
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句