我的 webpack 中有以下基本配置，与通过 TypeScript 加载样式相关:
{
module: {
rules: [{
test: /\.s?css$/,
use: [
{ loader: 'style-loader' },
{
loader: 'typings-for-css-modules-loader',
options: {
sass: true,
modules: true,
camelCase: true,
importLoaders: 1,
namedExport: true,
localIdentName: '[name]__[local]__[hash:base64:5]',
}
},
{ loader: 'sass-loader' },
]
}],
},
resolve: {
alias: {
app: srcPath,
},
modules: ['node_modules', srcPath],
extensions: ['.js', '.jsx', '.json', '.scss', '.css', '.tsx', '.ts', '.d.ts'],
},
}
在我的 tsconfig.json 中，我有以下内容需要匹配:
{
"compilerOptions": {
"paths": {
"app": ["./app"]
}
}
}
但是，当我尝试从 app/styles/root.scss 加载具有以下项目结构的文件时，我始终遇到错误:
├── components
│ └── Root.tsx
├── styles
│ └── root.scss
├── index.hbs
├── index.scss
├── index.scss.d.ts
└── index.tsx
TypeScript 似乎无法正确解析此路径。如果这是一个基于 JS 的普通文件，那就可以正常工作。
奇怪的是，我可以添加一个 root.scss.d.ts 以及 CSS 文件的定义，它将正确解析。我认为这有点奇怪，因为我专门使用 typings-for-css-modules-loader 来完成此任务。
如何让 TypeScript 解析 styles 目录下的这些 scss 文件？
最佳答案
修复
简单
declare module "*.scss";
更多
请参阅 JavaScript 到 TypeScript 迁移指南:https://basarat.gitbooks.io/typescript/content/docs/types/migrating.html
关于javascript - TypeScript 找不到样式模块，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45192427/