Repository navigation
fix: [build] keep path aliases out of type declarations - #992
Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
No actionable comments were generated in the recent review. Walkthrough
Merge Risk:
|
commit: |
There was a problem hiding this comment.
Let's replace the custom plugin with tsc-alias. It reads the ~/ alias from tsconfig, so we do not need to maintain a regex of our own.
- Add
tsc-aliastodevDependencies. - Add packages/react/tsconfig.alias.json:
{
"extends": "./tsconfig.json",
"compilerOptions": {
"paths": {
"~/*": ["./*"]
}
}
}tsc-alias needs this config. With tsconfig.json, it also rewrites react imports to node_modules/@types/react, because of the react entry in paths.
- Run it from closeBundle, and add it after typescript() in createPlugins:
import { replaceTscAliasPaths } from 'tsc-alias';
const resolveDeclarationAliases = () => ({
name: 'apsara-declaration-aliases',
closeBundle: () =>
replaceTscAliasPaths({ configFile: 'tsconfig.alias.json', outDir: 'dist' })
});There was a problem hiding this comment.
Done in 0add681. Thanks for the suggestion. I switched to tsc-alias and kept a small check that fails the build if a ~/ import is left.
| Custom plugin | tsc-alias |
|
|---|---|---|
| Alias rules | Own regex, does not read tsconfig | Reads tsconfig.alias.json |
| Code to maintain | About 40 lines of path logic | About 5 lines |
| Unresolved alias | Fails the build | Leaves the import as is, build passes |
| Dependencies | None | Adds tsc-alias and a second tsconfig |
| When it runs | In the bundle, before files are written | On dist after write, once per config (about 0.4s each) |
| Output | '../types/filters' |
'../types/filters.js' |
I went with tsc-alias because it takes the alias rules from tsconfig, so we no longer maintain our own regex. The one thing the old plugin had that tsc-alias does not is the failed build on a leftover alias. So closeBundle now reads every .d.ts in dist after tsc-alias runs and fails the build if it finds one. I tested this with a fake import('~/does-not-exist'), and the build failed with the file and line.
I also type-checked a small app against the built package with bundler and node16 module resolution. Both pass, and the .js paths resolve to their .d.ts files.
tsc-alias reads the ~/ alias from tsconfig.alias.json, which leaves out the react entry of tsconfig.json. The plugin fails the build if a declaration still imports through ~/.
# Conflicts: # pnpm-lock.yaml
Summary
Emitted
.d.tsfiles kept the~/path alias fromtsconfig.json. Some come from imports such asimport type { FilterSelectOption } from '~/types/filters', and TypeScript also writes inferred types asimport("~/..."), for example inCodeBlockandMarkdownAdapter.rollup-plugin-tsconfig-pathsresolves the alias in the JS output only.Apps cannot resolve these imports. With
skipLibCheck: truethe types becomeany, for exampleDataViewField['filterOptions'],filterType,dataTypeand theoptionsprop ofFilterChip. WithskipLibCheck: falsethey fail with TS2307. In an app with its own~/*alias they resolve to the app's files.After the bundle is written,
tsc-aliasrewrites these specifiers indistto relative paths. It reads the alias fromtsconfig.alias.json, which leaves out thereactentry oftsconfig.json. The build then fails if a declaration still imports through~/. The JS output does not change.Replace the placeholder option value
'string'with real values in the DataView and FilterChip test fixtures.FilterValueTypeisstring | number | boolean, so real values type-check.I have followed the pull request section of the contributing guide.