Svelte Template does not work with yarn workspaces
cstrnt opened this issue · 6 comments
Describe the bug
If you use the Svelte Template with Rollup using Yarn Workspaces and try to start the website it doesn't work and shows the error main.js:8 Uncaught ReferenceError: internal is not defined
Logs
(Rollup Logs)
(!) Unresolved dependencies
https://rollupjs.org/guide/en/#warning-treating-module-as-external-dependency
svelte/internal (imported by src\App.svelte)
(!) Missing global variable name
Use output.globals to specify browser global variable names corresponding to external modules
svelte/internal (guessing 'internal')
To Reproduce
I set up yarn workspaces and used degit to initialize my Svelte frontend. I ran yarn install
in the project root
Occasionally, this won't be possible, and that's fine – we still appreciate you raising the issue. But please understand that Svelte is run by unpaid volunteers in their free time, and issues that follow these instructions will get fixed faster.
Expected behavior
Svelte / Rollup should be able to resolve all it's dependencies with Yarn Workspaces just like other tools do
Information about your Svelte project:
-
Tested in Chrome Canary (80.0.3948.0)
-
Windows 10
-
Svelte 3.12.1
-
Rollup
Severity
Not that severe just pretty annoying to not be able to use svelte in such a monorepo context
Svelte / Rollup does work with yarn workspaces. I've setup a repo here: https://gitlab.com/dexterlabs/epic/
My subprojects are svelte components (not svelte apps) created by running degit sveltejs/component-template my-new-component
@neoel Thanks for providing an example, but this does not reflect the structure of my project and therefore doesn't solve the problem (yet) 🤕
I've got a packages folder containing the packages. My project root is empty (yours is not :D)
That should not matter, maybe you can provide an example of your setup.
I had the same issue with the Webpack template and found that webpack.config.js had resolve.alias
pointing to ./node_modules/svelte
, but Yarn Workspaces hoists the dependencies to the root node_modules, so I had to change it to join(__dirname, '../../node_modules/svelte')
.
I think the problem here is the same: Rollup is trying to load svelte
from the wrong node_modules folder.
I think the problem here is the same: Rollup is trying to load
svelte
from the wrong node_modules folder.
Yes, exactly. I got it to work by adding the rollup-plugin-alias to rollup.config.js
as such:
import path from 'path';
import alias from 'rollup-plugin-alias';
Then include alias()
as the first plugin:
plugins: [
alias({
entries: {
svelte: path.join(__dirname, '../../node_modules/svelte')
}
}),
// Rest of the plugins
]
Since the svelte app's path relative to the monorepo root is ./packages/app-svelte
, the ../../node_modules/svelte
path points to the root directory.
My monorepo package.json is:
{
"name": "my-app",
"private": true,
"version": "0.0.1",
"workspaces": [
"packages/*",
]
}
I think aliasing is the only way this would work, as demonstrated above.
if you think Svelte should be doing something it is not (which other tools are), however, please feel free to comment and we can re-open.