我的纱线工作区结构如下:
/project
package.json
/packages
/app
package.json
webpack.config.js
tsconfig.json
/src
index.ts
/api-adapter
package.json
/src
api.ts
为了构建/app
包,我使用带有 ts-loader 的 Webpack。这是配置:
// /packages/app/webpack.config.js
module.exports = {
entry: path.resolve(__dirname, "src/client/index.ts"),
mode: "development",
devtool: "inline-source-map",
module: {
rules: [
{
test: /\.tsx?$/,
use: "ts-loader",
exclude: /node_modules/
}
]
},
resolve: {
extensions: [".tsx", ".ts", ".js"]
},
output: {...}
};
和tsconfig.json
{
"compilerOptions": {
"module": "es6",
"target": "es6",
"removeComments": true,
"preserveConstEnums": true,
"sourceMap": true,
"noImplicitAny": true,
"outDir": "./dist/",
"moduleResolution": "node",
"allowSyntheticDefaultImports": true,
"esModuleInterop": true,
"lib": ["dom", "es6", "webworker"]
}
}
当我想从其他工作区导入模块时:
// /packages/app/src/index.ts
import { fetchSomething } from "api-adapter/src/api";
发生错误:
ERROR in ../api-adapter/src/api.ts
Module build failed (from /home/user/project/node_modules/ts-loader/index.js):
Error: Typescript emitted no output for /home/user/project/packages/api-adapter/src/api.ts.
但是当我添加扩展导入时,一切正常:
// /packages/app/src/index.ts
import { fetchSomething } from "api-adapter/src/api.ts";
如何修复 webpack 配置以将任何工作区模块作为 Typescript 导入而无需扩展?
我已经尝试过:
rules: [{
test: /\.tsx?$/,
use: "ts-loader",
exclude: /node_modules/,
include: [
__dirname,
path.resolve(__dirname, "../packages")
],
}]
和:
ERROR in ../api-adapter/src/api.ts 3:34
Module parse failed: Unexpected token (3:34)
You may need an appropriate loader to handle this file type.