我正在制作 React 组件库。项目结构是这样的:
src/
components/
utils/
hooks/
现在我尝试使用汇总生成类型 (.d.ts.) 文件。类型是生成的,但例如我的组件NumberInput
正在使用绝对导入Input
像这样的组件:
import Input from "components/Input/Input";
现在进口于NumberInput.d.ts
看起来完全一样:
import Input from "components/Input/Input";
但现在这些进口d.ts
文件不会被解析,因为没有用于生成代码的 tsconfig.json (我猜)。
tsconfig.json
{
"compilerOptions": {
"module": "esnext",
"target": "es5",
"lib": ["es6", "dom"],
"sourceMap": true,
"jsx": "react",
"moduleResolution": "node",
"rootDir": "src",
"noImplicitReturns": true,
"noImplicitThis": true,
"noImplicitAny": true,
"declaration": true,
"esModuleInterop": true,
"baseUrl": "src/",
"paths": {
"components/*": ["components/*"],
"models/*": ["hooks/*"],
"utils/*": ["utils/*"]
}
},
"exclude": ["node_modules", "build", "dist", "scripts", "acceptance-tests", "webpack", "jest"],
"types": ["typePatches"]
}
rollup.config.js
export default {
input: [
"./src/index.ts",
...getFiles("./src/components", extensions),
...getFiles("./src/hooks", extensions),
...getFiles("./src/utils", extensions)
],
output: [
{
dir: "dist",
format: "esm",
sourcemap: true
}
],
external: ["react", "react-dom", "styled-components"],
plugins: [
resolve(),
commonjs(),
typescript({
tsconfig: "./tsconfig.build.json",
declaration: true,
declarationDir: "dist"
}),
image(),
url({
include: ["**/*.woff2"],
limit: Infinity
}),
css(),
terser()
],
external: ["react", "react-dom", "styled-components"]
};
有什么方法可以在生成类型时控制绝对导入吗?我想在我的项目中使用绝对导入,但是当生成类型时,我不会关心它们的外观,只要它们能工作。