Comments (4)
Holy crap I figured it out!!!!!!!!!!!!!!!!!!!!!!!! 🎉 🎊 🥳 🎉 🥳
Or rather, I have a solution. To try to figure out what was going wrong, I compared the results of running solid-start dev
in a regular repo vs the monorepo. I noticed that, in the regular repo, three dependencies were being pre-bundled solid-js/web
, solid-js
, and solid-js/dev
but, in the monorepo, only two dependencies were being pre-bundled solid-js/web
, solid-js/dev
.
Adding solid-js
to the vite config's optimizeDeps.include
array got the monorepo to pre-bundle solid-js/web
, solid-js
, and solid-js/dev
just like in the regular repo and it eliminated the warning that there were multiple instances of solid-js. It also finally got the default start page to load in a browser. Unfortunately, it was clear something was still going wrong as reactivity on the webpage wasn't working and the page styles hadn't loaded. A console error indicated that
<script
type="module"
src="/node_modules/solid-start/runtime/entry.jsx"
></script>
in index.html
was failing to load. I realized this made sense, because the dev server root was the project root rather than the workspace root (and solid-start
was installed in the workspace root). I tried changing the module link to
<script
type="module"
src="../../node_modules/solid-start/runtime/entry.jsx"
></script>
But I discovered that the dev server couldn't load anything outside its root. However, by symlinking the solid-start
package in the workspace root's node_modules
into the project root's node_modules
, then the dev server was able to load the code without issue and everything started working.
Edit:
Rather than symlinking, another option is to specify that the solid-start
package should not be hoisted to the workspace root.
I should be able to put together a PR for this in a day or two.
from solid-start.
Anyyone familiar could use help here. There needs to be a single copy of Solid if used in the same app. That requirement cannot change and is true of most frameworks so have no idea why these workspace technologies seem to be defaulting otherwise.
from solid-start.
Upon further inspection, the issue appears to be that vite is caching build artifacts in a special node_modules/.vite
folder. In this case, build artifacts include solid-js/dev
, solid-js/web
, and chunk-A...
modules. The chunk-A...
module includes its own
var DEV;
{
DEV = {
writeSignal,
serializeGraph
};
}
if (globalThis) {
if (!globalThis.Solid$$)
globalThis.Solid$$ = true;
else
console.warn("You appear to have multiple instances of Solid. This can lead to unexpected behavior.");
}
This is currently my best guess to explain how a second copy of solid-js
is being created when only one version is installed. Unfortunately, following vite's instructions to disable build dependency caching (optimizeDeps.exclude
) and test if that fixes the problem does not seem to work.
from solid-start.
That requirement cannot change and is true of most frameworks so have no idea why these workspace technologies seem to be defaulting otherwise.
It should be noted that the workspace only installs a single version of solid-js
, so something else appears to be going wrong. In this case, it looks like the current vite
build setup is the culprit (see above).
from solid-start.
Related Issues (20)
- [Bug?]: Cannot get response returned by a server function via a GET request HOT 1
- [Bug?]:TypeError: Cannot read properties of null (reading 'FormContext')
- [Bug?]: [vite] Pre-transform error: xxx.tsx: Property value expected type of boolean but got undefined HOT 1
- [Bug?]: Server action chunks are not generated in production build when using `experimental.islands` HOT 5
- [Feature?]: Websocket for SolidStart/SolidJS, instead of fetch HOT 2
- Issue with File Updates on Dev Server HOT 1
- [Feature?]: Tailwind template should come with automatic theme switching support "out-of-the-box"
- [Bug?]: Hydration Mismatch for passed JSX elements HOT 5
- [Bug?]: `compressPublicAssets` nitro config does not work HOT 4
- [Bug?]: Wrong server function called due to incorrect handling of file hash collisions for server func sources
- [Bug?]: Landing page is broken on small screen size
- [Bug?]: how to prerender *404 page? HOT 2
- [Feature?]: Add an option to disable lazy loading in `<FileRoutes />` HOT 3
- [Bug?]: "Zero-config" Netlify provider does not load a Netlify preset automatically HOT 4
- [Bug?]: TypeError: Response body object should not be disturbed or locked HOT 3
- [Bug?]: pnpm create solid@latest doesn't work HOT 1
- [Bug?]: Using layouts with route groups at root level causes hydration errors HOT 3
- [Bug?]: Unexpected Link Element Generation for Stylesheet Imports in Production Environment HOT 1
- API routes have to be inline exported function declarations
- [Feature?]: Add ability to add/modify head classes, lang and lang dir HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from solid-start.