-
Notifications
You must be signed in to change notification settings - Fork 795
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(compiler): don't mistake aliased paths for collections imports #5620
Conversation
this commit fixes an issue where stencil builds that followed a successful build would result in the following error: ``` [ ERROR ] Component Tag Name "my-component" Must Be Unique Please update the components so "my-component" is only used once: ./src/components/my-component/my-component.tsx ./dist/collection/components/my-component/my-component.js ``` this issue manifested on windows machines when building the ionic framework after a successful build. we were able reproduce this with a minimal stencil-component-starter that included the following in its `tsconfig.json`: ```json { paths: { "@utils/*": ["src/utils/*"] } } ``` the import alias would be used as such: ```ts // src/utils/helpers.ts export const foo = () => console.log('hello'); // src/utils/other-file.ts import { foo } from '@utils/helpers'; export const bar = () => { foo(); } ``` where in the example above, `helpers.ts` is imported by `other-file.ts`, and resolved via the `@utils/*` path alias. note that neither of these files needed to be imported into a stencil component in order for the error to be replicated - they just need to sit in the `src` directory of the project. the reason the project would fail to compile is that the first build would create a `dist/collections` directory, as the `dist` output target would synthetically inject (automatically decide the project should also have) the collections output target in its output. on the second compilation, stencil would attempt to reconcile `@utils/helpers` as a collections output, and inadvertantly pull in `dist/collections/*` into the build context. this caused previously compiled versions of any components to be recommpiled. when stencil tried to check for html tag uniqueness, it would detect multiples components with the same tag, with the previously mentioned error: ``` [ ERROR ] Component Tag Name "my-component" Must Be Unique Please update the components so "my-component" is only used once: ./src/components/my-component/my-component.tsx ./dist/collection/components/my-component/my-component.js ``` Fixes: #2319 STENCIL-1252
88168f2
to
7104b05
Compare
|
Path | Error Count |
---|---|
src/dev-server/index.ts | 37 |
src/dev-server/server-process.ts | 32 |
src/compiler/prerender/prerender-main.ts | 22 |
src/testing/puppeteer/puppeteer-element.ts | 21 |
src/runtime/client-hydrate.ts | 20 |
src/screenshot/connector-base.ts | 19 |
src/runtime/vdom/vdom-render.ts | 17 |
src/dev-server/request-handler.ts | 15 |
src/compiler/prerender/prerender-optimize.ts | 14 |
src/compiler/sys/stencil-sys.ts | 14 |
src/sys/node/node-sys.ts | 14 |
src/compiler/prerender/prerender-queue.ts | 13 |
src/compiler/sys/in-memory-fs.ts | 13 |
src/runtime/connected-callback.ts | 13 |
src/runtime/set-value.ts | 13 |
src/compiler/output-targets/output-www.ts | 12 |
src/compiler/transformers/test/parse-vdom.spec.ts | 12 |
src/compiler/transformers/transform-utils.ts | 12 |
src/compiler/transpile/transpile-module.ts | 12 |
src/mock-doc/test/attribute.spec.ts | 12 |
Our most common errors
Typescript Error Code | Count |
---|---|
TS2322 | 361 |
TS2345 | 345 |
TS18048 | 204 |
TS18047 | 82 |
TS2722 | 37 |
TS2532 | 24 |
TS2531 | 21 |
TS2454 | 14 |
TS2790 | 11 |
TS2352 | 9 |
TS2769 | 8 |
TS2538 | 8 |
TS2416 | 7 |
TS2493 | 3 |
TS18046 | 2 |
TS2684 | 1 |
TS2430 | 1 |
Unused exports report
There are 14 unused exports on this PR. That's the same number of errors on main, so at least we're not creating new ones!
Unused exports
File | Line | Identifier |
---|---|---|
src/runtime/bootstrap-lazy.ts | 21 | setNonce |
src/screenshot/screenshot-fs.ts | 18 | readScreenshotData |
src/testing/testing-utils.ts | 198 | withSilentWarn |
src/utils/index.ts | 145 | CUSTOM |
src/utils/index.ts | 269 | normalize |
src/utils/index.ts | 7 | escapeRegExpSpecialCharacters |
src/compiler/app-core/app-data.ts | 25 | BUILD |
src/compiler/app-core/app-data.ts | 115 | Env |
src/compiler/app-core/app-data.ts | 117 | NAMESPACE |
src/compiler/fs-watch/fs-watch-rebuild.ts | 123 | updateCacheFromRebuild |
src/compiler/types/validate-primary-package-output-target.ts | 61 | satisfies |
src/compiler/types/validate-primary-package-output-target.ts | 61 | Record |
src/testing/puppeteer/puppeteer-declarations.ts | 485 | WaitForEventOptions |
src/compiler/sys/fetch/write-fetch-success.ts | 7 | writeFetchSuccessSync |
PR built and packed!Download the tarball here: https://github.com/ionic-team/stencil/actions/runs/8545750046/artifacts/1382799134 If your browser saves files to
|
What is the current behavior?
See 'new behavior`
GitHub Issue Number: #2319
What is the new behavior?
this commit fixes an issue where stencil builds that followed a successful build would result in the following error:
this issue manifested on windows machines when building the ionic framework after a successful build. we were able reproduce this with a minimal stencil-component-starter that included the following in its
tsconfig.json
:the import alias would be used as such:
where in the example above,
helpers.ts
is imported byother-file.ts
, and resolved via the@utils/*
path alias. note that neither of these files needed to be imported into a stencil component in order for the error to be replicated - they just need to sit in thesrc
directory of the project.the reason the project would fail to compile is that the first build would create a
dist/collections
directory, as thedist
output target would synthetically inject (automatically decide the project should also have) the collections output target in its output. on the second compilation, stencil would attempt to reconcile@utils/helpers
as a collections output, and inadvertantly pull indist/collections/*
into the build context. this caused previously compiled versions of any components to be recommpiled.when stencil tried to check for html tag uniqueness, it would detect multiples components with the same tag, with the previously mentioned
error:
Documentation
N/A
Does this introduce a breaking change?
Testing
Note: This requires a Windows machine
Clone the following repo: https://github.com/liamdebeasi/blank-stencil-repro/tree/windows-name-alias
Steps to reproduce:
windows-name-alias
branchnpm install
to install dependenciesnpm run build
npm run start
. Observe that the reported error appears.npm i @stencil/[email protected]
npm run build
npm run start
. Observe that the reported error no longer appears.Other information
STENCIL-1252