bhauman / figwheel-main

Figwheel Main provides tooling for developing ClojureScript applications
https://figwheel.org
Eclipse Public License 1.0
640 stars 93 forks source link

The "Using NPM" doc doesn't mention the need to point the Host page to a different src #302

Closed simonacca closed 2 years ago

simonacca commented 3 years ago

When switching from :target :browser to :target :bundle (for example with :auto-bundle :webpack), it is necessary to change the Host page as such:

<script src="cljs-out/myproject-main.js" ></script>

into

<script src="cljs-out/myproject/main_bundle.js" ></script>.

However this is not mentioned in the Using NPM guide.

augustl commented 2 years ago

Can confirm, I just spent a good two hours trying to figure out why I got the following errors:

Uncaught SyntaxError: import not found: npmDeps

Uncaught SyntaxError: The requested module './npm_deps.js' does not provide an export named 'npmDeps'

Including the _bundle.js variant of the main file worked wonders!

bhauman commented 2 years ago

Hey I just read the doc and it is in there for sure. https://figwheel.org/docs/npm.html#configure-our-clojurescript-build So maybe you are asking for something more concise and clear for this situation?

augustl commented 2 years ago

The documentation makes it super clear that a bundle file will be generated! But my assumption was that the Figwheel build would somehow include this bundle file from the existing non-bundled file, and that I didn't have to change anything other than the figwheel config itself. I didn't quite catch from the documentation that I should also change the script tag in my HTML to point directly to the generated bundle file in :final-output-filename.

So a nice tweak to the docs in my opinion would be if it included a small code snippet showing a script tag that points to the _bundle.js variant, so that my speed reading internet brain would catch this extra step more easily :)

bhauman commented 2 years ago

Good point. Fixing the docs now. Thanks!

bhauman commented 2 years ago

Just clarified the docs.

Definitely a case of being too close to it. I'd love some folks to really boil this down and make it more accessible.

bhauman commented 2 years ago

See if these docs meet the need:

https://figwheel.org/docs/npm.html#modify-your-indexhtml-host-page-to-load-the-bundle

augustl commented 2 years ago

Definitely a case of being too close to it. I'd love some folks to really boil this down and make it more accessible.

I'll see what I can do! I'm just setting this up in a project at work, and I'm practicing technical writing as I'm in the process of writing my first tech book. A potential killer combo, if you ask me :)

See if these docs meet the need:

This looks much better, and would have saved me a couple of hours. Good stuff!

bhauman commented 2 years ago

@augustl That is a killer combo!

simonacca commented 2 years ago

Thank you @bhauman for the edit and thanks to @augustl for the additional context, that's exactly the problem I faced as well!

See if these docs meet the need:

Looks good to me!

Can be closed from my side.