Qwik Library ⚡️

• Qwik Docs
• Discord
• Qwik on GitHub
• @QwikDev
• Vite
• Partytown
• Mitosis
• Builder.io

Project Structure

Inside your project, you'll see the following directories and files:

├── public/
│   └── ...
└── src/
    ├── components/
    │   └── ...
    └── index.ts

• src/components: Recommended directory for components.

• index.ts: The entry point of your component library, make sure all the public components are exported from this file.

Development

Development mode uses Vite's development server. For Qwik during development, the dev command will also server-side render (SSR) the output. The client-side development modules are loaded by the browser.

pnpm dev

Note: during dev mode, Vite will request many JS files, which does not represent a Qwik production build.

Production

The production build should generate the production build of your component library in (./lib) and the typescript type definitions in (./lib-types).

pnpm build

sideEffects: false

This package is configured with "sideEffects": false in its package.json. This tells bundlers that the module has no side effects when imported. Consequently, to maintain the integrity of tree-shaking optimizations, please ensure your code truly contains no side effects (such as modifying global variables or the DOM upon import). If your module does introduce side effects, remove "sideEffects": false or specify the specific files with side effects. Be sure to only remove it from the specific file where the global is being set. Finally, verify that your build continues to function as expected after making any adjustments to the sideEffects setting.