{"_id":"@deboxsoft/bytemd-sveltekit","_rev":"1-421a135f405940a6965d39d306e82a71","name":"@deboxsoft/bytemd-sveltekit","dist-tags":{"latest":"2.0.0"},"versions":{"2.0.0":{"name":"@deboxsoft/bytemd-sveltekit","version":"2.0.0","type":"module","dependencies":{"@popperjs/core":"^2.11.2","@primer/css":"^15.2.0","codemirror-ssr":"^0.0.6","hast-util-sanitize":"^4.0.0","js-yaml":"^4.1.0","lodash-es":"^4.17.21","medium-zoom":"^1.0.6","mermaid":"^8.13.10","rehype-raw":"^6.1.1","rehype-sanitize":"^5.0.1","rehype-stringify":"^9.0.3","remark-breaks":"^3.0.2","remark-footnotes":"^4.0.1","remark-frontmatter":"^4.0.1","remark-gemoji":"^7.0.1","remark-gfm":"^3.0.1","remark-math":"^5.1.1","remark-parse":"^10.0.1","remark-rehype":"^10.1.0","select-files":"^1.0.1","tippy.js":"^6.3.7","unified":"^10.1.2","unist-util-visit":"^4.1.0","vfile":"^5.3.0","word-count":"^0.2.2"},"devDependencies":{"@bytemd/plugin-breaks":"workspace:~","@bytemd/plugin-footnotes":"workspace:~","@bytemd/plugin-frontmatter":"workspace:~","@bytemd/plugin-gemoji":"workspace:~","@bytemd/plugin-gfm":"workspace:~","@bytemd/plugin-highlight":"workspace:~","@bytemd/plugin-highlight-ssr":"workspace:~","@bytemd/plugin-math":"workspace:~","@bytemd/plugin-math-ssr":"workspace:~","@bytemd/plugin-medium-zoom":"workspace:~","@bytemd/plugin-mermaid":"workspace:~","@nurdiansyah/rollup":"^1.7.3","@sveltejs/kit":"next","autoprefixer":"^10.4.0","cssnano":"^5.0.10","github-markdown-css":"^5.1.0","highlight.js":"^11.4.0","katex":"^0.15.2","postcss":"^8.3.11","rollup":"^2.64.0","rollup-plugin-svelte":"^7.1.0","sass":"^1.43.4","svelte":"^3.42.6","svelte-check":"^2.2.6","svelte-preprocess":"^4.9.4","svelte2tsx":"^0.4.8","tslib":"^2.3.1","typescript":"^4.4.3"},"exports":{"./package.json":"./package.json","./editor.svelte":"./editor.svelte","./editor":"./editor.js","./help.svelte":"./help.svelte","./helpers":"./helpers.js","./icons":"./icons.js","./index.scss":"./index.scss",".":"./index.js","./locales/ca.json":"./locales/ca.json","./locales/de.json":"./locales/de.json","./locales/en.json":"./locales/en.json","./locales/es.json":"./locales/es.json","./locales/fr.json":"./locales/fr.json","./locales/ja.json":"./locales/ja.json","./locales/ko.json":"./locales/ko.json","./locales/nb_NO.json":"./locales/nb_NO.json","./locales/pl.json":"./locales/pl.json","./locales/ru.json":"./locales/ru.json","./locales/zh_Hans.json":"./locales/zh_Hans.json","./locales/zh_Hant.json":"./locales/zh_Hant.json","./plugins/breaks":"./plugins/breaks/index.js","./plugins/footnotes":"./plugins/footnotes/index.js","./plugins/frontmatter":"./plugins/frontmatter/index.js","./plugins/gemoji":"./plugins/gemoji/index.js","./plugins/gfm/icons":"./plugins/gfm/icons.js","./plugins/gfm":"./plugins/gfm/index.js","./plugins/gfm/locales/ca.json":"./plugins/gfm/locales/ca.json","./plugins/gfm/locales/de.json":"./plugins/gfm/locales/de.json","./plugins/gfm/locales/en.json":"./plugins/gfm/locales/en.json","./plugins/gfm/locales/es.json":"./plugins/gfm/locales/es.json","./plugins/gfm/locales/fr.json":"./plugins/gfm/locales/fr.json","./plugins/gfm/locales/nb_NO.json":"./plugins/gfm/locales/nb_NO.json","./plugins/gfm/locales/pl.json":"./plugins/gfm/locales/pl.json","./plugins/gfm/locales/ru.json":"./plugins/gfm/locales/ru.json","./plugins/gfm/locales/zh_Hans.json":"./plugins/gfm/locales/zh_Hans.json","./plugins/gfm/locales/zh_Hant.json":"./plugins/gfm/locales/zh_Hant.json","./plugins/highlight":"./plugins/highlight/index.js","./plugins":"./plugins/index.js","./plugins/math":"./plugins/math/index.js","./plugins/math/locales/ca.json":"./plugins/math/locales/ca.json","./plugins/math/locales/en.json":"./plugins/math/locales/en.json","./plugins/math/locales/es.json":"./plugins/math/locales/es.json","./plugins/math/locales/fr.json":"./plugins/math/locales/fr.json","./plugins/math/locales/ja.json":"./plugins/math/locales/ja.json","./plugins/math/locales/nb_NO.json":"./plugins/math/locales/nb_NO.json","./plugins/math/locales/pl.json":"./plugins/math/locales/pl.json","./plugins/math/locales/ru.json":"./plugins/math/locales/ru.json","./plugins/math/locales/zh_Hans.json":"./plugins/math/locales/zh_Hans.json","./plugins/math/locales/zh_Hant.json":"./plugins/math/locales/zh_Hant.json","./plugins/math-common/icons":"./plugins/math-common/icons.js","./plugins/math-common":"./plugins/math-common/index.js","./plugins/medium-zoom":"./plugins/medium-zoom/index.js","./plugins/mermaid/icons":"./plugins/mermaid/icons.js","./plugins/mermaid":"./plugins/mermaid/index.js","./plugins/mermaid/locales/ca.json":"./plugins/mermaid/locales/ca.json","./plugins/mermaid/locales/de.json":"./plugins/mermaid/locales/de.json","./plugins/mermaid/locales/en.json":"./plugins/mermaid/locales/en.json","./plugins/mermaid/locales/es.json":"./plugins/mermaid/locales/es.json","./plugins/mermaid/locales/fr.json":"./plugins/mermaid/locales/fr.json","./plugins/mermaid/locales/nb_NO.json":"./plugins/mermaid/locales/nb_NO.json","./plugins/mermaid/locales/pl.json":"./plugins/mermaid/locales/pl.json","./plugins/mermaid/locales/ru.json":"./plugins/mermaid/locales/ru.json","./plugins/mermaid/locales/zh_Hans.json":"./plugins/mermaid/locales/zh_Hans.json","./status.svelte":"./status.svelte","./toc.svelte":"./toc.svelte","./toolbar.svelte":"./toolbar.svelte","./types":"./types.js","./viewer.svelte":"./viewer.svelte","./viewer":"./viewer.js"},"svelte":"./index.js","types":"./index.d.ts","gitHead":"2f2d2aff7e5bdd81f65d2b34cc73ce262614029c","description":"A barebones project that provides the essentials for writing highly-optimized, reusable packages in Svelte using SvelteKit's [`package`](https://kit.svelte.dev/docs#packaging) feature.","_id":"@deboxsoft/bytemd-sveltekit@2.0.0","_nodeVersion":"14.17.0","_npmVersion":"8.5.1","dist":{"integrity":"sha512-jaHq0BkQ77SiDq+1xK90ebZG95O/72t509lHss1kOU0ZnUG7Wctf0OHdqciHPJyA5P6EVT/DTqncwqU1Ko01dw==","shasum":"9d9afcd6e2d4411373899857b49c424abc41cb63","tarball":"https://registry.npmjs.org/@deboxsoft/bytemd-sveltekit/-/bytemd-sveltekit-2.0.0.tgz","fileCount":97,"unpackedSize":117910,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiLb6WACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo1aQ//a2quUYNHq2vxOnqZstbugYYEzhkZt69e0VbUnvk2kttkP/jN\r\njdVcCn/M81NJ3uGmmDthTTPh+foqOPIytCAgNotedZ6qs5nbP3w3MaIUMGYK\r\n8ulSCpo0K/sSBB/9f3HuLQO+IBTnUleEgJMssVDLXg/UxpbaQTrjTGLkkQYk\r\n4rb8U3xBEUVGWAE2t/VG4eAwKf3ebOG+AgOZks6quRQPdZBZ7wCi/W5jzcaw\r\nxPGNX/GHyNeZk2AEmr09WM20QMvyEDppU4FQs3hwbLO5EUQGsOQMdygkJ49J\r\n6Hl75RcHcNW4eCUP7EJ1+xzkNon3UAAeOdEVhdXQ7rzURHJB64kc9ZvI9HNg\r\nlkz/h0CgRfeNDJ+GGoW/PFJpgEm2E1KekyywNnF+4FDnwubb7CbckE1zucDY\r\nwYikyCHoYvnHW9CWknVH605BTsRdidaI7Si494p6dY5yAsEqvq53KBU3Qumu\r\nZ11uSaGtg7VWNeZBcoZstBpR8DKOOC86V69H3LQh9nP63Ce6/Di9VdijaEaN\r\nLMbA3fUuJ/L1wKF5f+7hYwSROnZvDCvXFBwDk2WRqsCXPHtElbvIxvi5/AfZ\r\nXyVctsSxKi/Ii7ryTpDa/vi7ELLdiOwjtfcDqOC6ThRsRfyoRxabWhytS9I8\r\n75Od/OLV3ug3A5WLgzvC4BMevgYU/szd92g=\r\n=Zjlp\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCRUgutf0NAMd7UVgPcUke9sQxf+aVVWSOfJMOuScdyHQIgRas0LvU/qGtIZJpdryQFcsK9pJhdev4YA0LIISQoy2A="}]},"_npmUser":{"name":"nurdiansyah","email":"deboxserver@gmail.com"},"directories":{},"maintainers":[{"name":"nurdiansyah","email":"deboxserver@gmail.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/bytemd-sveltekit_2.0.0_1647165078396_0.8155821239263294"},"_hasShrinkwrap":false}},"time":{"created":"2022-03-13T09:51:18.348Z","2.0.0":"2022-03-13T09:51:18.584Z","modified":"2022-04-05T03:32:17.537Z"},"maintainers":[{"name":"nurdiansyah","email":"deboxserver@gmail.com"}],"description":"A barebones project that provides the essentials for writing highly-optimized, reusable packages in Svelte using SvelteKit's [`package`](https://kit.svelte.dev/docs#packaging) feature.","readme":"# sveltekit-package-template\n\nA barebones project that provides the essentials for writing highly-optimized, reusable packages in Svelte using SvelteKit's [`package`](https://kit.svelte.dev/docs#packaging) feature.\n\nAll styles are component-scoped and preprocessed into minified and prefixed CSS during packaging using [cssnano](https://cssnano.co/) and [autoprefixer](https://github.com/postcss/autoprefixer). TypeScript type definitions are generated automatically from your components using [svelte2tsx](https://github.com/sveltejs/language-tools/tree/master/packages/svelte2tsx).\n\n## The Problem\n\nOne of Svelte's largest pitfalls currently is it's ecosystem. Compared to more mainstream frameworks, it's userland is tiny in comparison to the thousands of available components on npm. While popularity is a large contribution to this, lack of documentation and resources is also a problem.\n\nMany packages at the moment have some sort of pitfall. Some require bundling a large stylesheet for the entire library just to use a single component. Others require developers using it to setup a package such as [`svelte-preprocess`](https://github.com/sveltejs/svelte-preprocess) because they use TypeScript internally. Most of all, there really just isn't much information out there on library authoring. What many don't realize is that all of these aformentioned pitfalls can be worked around.\n\nWhile svelte does offer an [official component template](https://github.com/sveltejs/component-template), it lacks many features required for a production-ready package (typescript, preprocessing, styling conventions).\n\n## Getting Started\n\nThese commands will set you up with a SvelteKit development environment:\n\n```bash\nnpx degit tropix126/sveltekit-package-template my-package\ncd my-package\nnpm install # or pnpm, yarn, etc...\nnpm run dev\n```\n\nFrom there, you can edit the example Counter component in [src/lib/Counter/Counter.svelte](/src/lib/Counter/Counter.svelte).\n\nThe [`index.ts`](/src/lib/index.ts) file in [`src/lib`](/src/lib) exports your components for use in the package.\n\n## Packaging and Publishing\n\n### Packaging\n\nTo package your components, simply run the package command:\n\n```bash\nnpm run package\n```\n\nThis will preprocess the contents of [`src/lib`](/src/lib) into a `package` folder at the root of your project.\n\n### Publishing to NPM\n\nAfter you have generated the `package` folder, run `npm publish ./package` to publish your library to NPM.\n\nBe sure to properly configure `package.json` with the correct data before publishing.\n\n## Routes\n\nSince the package command only generates it's files from [`src/lib`](/src/lib), you are free to put whatever you wish in the [`routes`](/src/routes) folder. This could be used as a documentation site for your component, as an example.\n\n## Using your Package\n\nConsumers of your package can import components from it in external projects like so:\n```html\n<script>\n    import { Component } from \"my-package\";\n</script>\n\n<Component />\n```\n\n## Setting up Documentation\n\nMost components will need documentation in some form. This template doesn't have any opinions on how documentation should be handled, however it does provide you with SvelteKit's `routes` folder which can be used for this. Below are some very useful svelte-focused tools that can make your life considerably easier when documenting components:\n- [vite-plugin-svled](https://github.com/mattjennings/vite-plugin-sveld) is a vite port of [sveld](https://github.com/carbon-design-system/sveld/), which allows you to automatically generate API documentation for your svelte components using typescript types and JSDoc comments.\n- [mdsvex](https://mdsvex.pngwn.io/) is a superset of markdown that allows the usage of Svelte components and interactive logic. Since mdsvex preprocesses your markdown files into Svelte components, it can also be used as SvelteKit routes.\n- [mdsvex-sveld](https://github.com/mattjennings/mdsvex-sveld) is an mdsvex plugin that automatically outputs markdown tables for component API documentation using [sveld](https://github.com/carbon-design-system/sveld/).\n\n## Setting up Theming\n\nIf you plan to develop a large amount of components, it may become necessary to have people import a theme stylesheet containing variables. This can be done by creating a `theme.css` file in [`src/lib`](/src/lib) and having people import it from `node_modules`.\n\nDevelopers using your library could import the theme file like so:\n```html\n<script>\n    import \"my-package/theme.css\";\n    import { ComponentThatUsesTheming } from \"my-package\";\n</script>\n\n<ComponentThatUsesTheming />\n```\n\nMany modern bundlers support importing CSS as ES Modules. This is likely to be the best way of importing theme files, as they can be easily resolved from `node_modules`. Alternatively, you can use @import syntax with the postcss-import plugin or sass in your \\<style> tags, or consider CDNS such as [unpkg](https://unpkg.com/).\n","readmeFilename":"README.md"}