Intro
The idea of the following post is to make a quick, practical and simple version of how to create a package that can be downloaded ...
For further actions, you may consider blocking this person and/or reporting abuse
Great write up.
What does the svelte part o the npm package do. I understand the standard entry point or module reference. What is actually using that?
Hey Zane, specifically which part are you referring to?
‘’’
"main": "dist/index.js",
"module": "dist/index.mjs",
"svelte": "src/index.js",
"scripts": {
"build": "rollup -c",
"dev": "rollup -c -w"
},
‘’’
Just the svelte key in the package.json. What uses that?
From the svelte repository:
Your package.json has a "svelte" field pointing to src/index.js, which allows Svelte apps to import the source code directly, if they are using a bundler plugin like rollup-plugin-svelte or svelte-loader (where resolve.mainFields in your webpack config includes "svelte"). This is recommended.
👌
Awesome! Ty.
Really nice post thanks 👍 Nevertheless, I would encourage to use vanilla js in the export of the Svelte component in
index.js:If this is not done the users of the library will probably have some trouble testing the application with Jest because the node_module files are ignored by default (so es6 is not supported).
Thanks, that helped.
I have been writing code using Svelte for several months now. And, I am just now getting some stuff out into components. I think this worked.
github.com/copious-world/svelte-fl...
I have a question, how would you go about publishing a package that exports many components?
Thank you very much for the article btw! :)
Hi Diogo :)
You can export all components into the index.js file.
View this repo example github.com/joeattardi/svelte-tabs/...
Does this help you? If not, write to me!
Good weekend
Hi Augistín!
Yep this solved the problem, thank you very much!!
Have a wonderful week. :)
@agustinl thanks for the write up. I should be using it shortly, bookmarked !!
I think that in the
rollup.config.jsfile there's a typo:{ file: pkg.module, 'format': 'en' }should be
{ file: pkg.module, 'format': 'es' }