Stencil: Stencil breaks when using symlinks
Stencil version:
// I used `npm init stencil`
@stencil/core@~0.16.2
// I do know it doesn't work with @stencil/[email protected] either.
I'm submitting a:
[ X] bug report
[ ] feature request
[ ] support request
Current behavior:
I'm trying to use stencil in a monorepo managed by lerna, but stencil breaks when I try to import packages from a symlink.
Expected behavior:
Stencil/Rollup should resolve symlinks as regular packages.
Steps to reproduce:
- I made a repo for reproducing it with lerna: https://github.com/liron-navon/stencil-lerna-poc, it contains instructions in the readme file to run it.
- You can also reproduce it by including another local package using "npm link" or "yarn workspaces".
Related code:
The related code is in the repository: https://github.com/liron-navon/stencil-lerna-poc
import MyLocalPackage from 'my-local-package';
// stencil breaks here ----
Other information:
I believe it's an issue with rollup configurations and not specifically with stencil's compiler, But I can't prove it since stencil won't allow overriding rollup settings, because of this issue: https://github.com/rollup/rollup/issues/447
liron-navon
All 15 comments
I'm having issues after moving an existing Stencil lib into a lerna monorepo too. I'm on 0.18.0.
I get:
[ ERROR ] Rollup: Missing Export: ../caseos-client/esm/redux/store.js:1:7
'default' is not exported by ../caseos-client/node_modules/debug/src/browser.js
L1: import Debug from 'debug';
L2: import { applyMiddleware, compose, createStore as createReduxStore } from 'redux';
[17:39.0] build failed in 7.42 s
The lib caseos-client uses debug which was resolved perfectly before moving the 2 libs into lerna.
bitflower
on 11 May 2019
Experiencing the same thing.
Dohxis
on 15 May 2019
Why does the stencil team ignore this for so long?
liron-navon
on 10 Jul 2019
any progress on this one?
Dohxis
on 18 Jul 2019
May issues have all disappeared since using lerna and Stencil One
bitflower
on 18 Jul 2019
For me, it still does not watch for changes, so I need to restart the build process for changes to be visible.
Dohxis
on 18 Jul 2019
Ah, live reload of a dependency? Yes that‘s still a topic. I think you can also save the stencil.config of the consuming app tontrigher a reload of the relative dependency.
bitflower
on 18 Jul 2019
Seems like it would work, but after saving stencil config, Rollup throws UNRESOLVED_IMPORT for the linked library.
Dohxis
on 18 Jul 2019
It still doesn't work - I'm not talking about hot reload, regular load of symlinks doesn't work either.
liron-navon
on 21 Aug 2019
@liron-navon It seems that the problem is caused by the fact that you're using commonjs exports, which are handles by a plugin in rollup and that that plugin is not configured for these symlinks.
I got your example repo working by adding the following to the stencil.config.ts:
commonjs: {
include: /node_modules|(..\/.+)/
} as any
Could you check if adding that solves your problem (this regex adds ../{foldername} only, if you link from somewhere else on your system you may need to change the regex to include those paths.
wslaghekke
on 4 Oct 2019
@wslaghekke thanks for this info, this worked for me and a webpack library (UMD) we were npm linking to, which had the 'default is not exported' complaint
nathanb21
on 7 Oct 2019
@wslaghekke yea, this fixes it, thanks
liron-navon
on 10 Oct 2019
@wslaghekke Was struggling with this issue today as well, your suggestion fixed it. Thank you!
viljamis
on 13 Oct 2019
I am still having problems with linked packages, none of the fixes above work for me. The package I am linking to is a component collection built with stencil, so uses ES6 exports, and has a 'ts' file exporting various types that I want to import. The component collection is private and is not going to be published on npm, so I am using "npm link":
npm link myPackage
In myComponent.tsx:
import { Object } from "myPackage/file";
When building with "npm run build" or debugging with "npm start", Typescript correctly resolves the import and the definitions, but Rollup reports:
[ WARN ] Bundling Warning UNRESOLVED_IMPORT
'myPackage/file' is imported by
src/components/myComponent/lazy_xyz-myComponent.js, but could not be
resolved – treating it as an external dependency
This is with the latest @stencil/core 1.8.11
keean
on 7 Mar 2020
@keean did you get this resolved?
mattvb91
on 3 Jul 2020
Related issues
bekliev
·
3Comments
cjorasch
·
3Comments
lcswillems
·
3Comments
glemiere
·
3Comments
mitchellsimoens
·
3Comments
Most helpful comment
@liron-navon It seems that the problem is caused by the fact that you're using commonjs exports, which are handles by a plugin in rollup and that that plugin is not configured for these symlinks.
I got your example repo working by adding the following to the stencil.config.ts:
commonjs: { include: /node_modules|(..\/.+)/ } as anyCould you check if adding that solves your problem (this regex adds ../{foldername} only, if you link from somewhere else on your system you may need to change the regex to include those paths.