Skip to content

Commit

Permalink
Document changes for 0.2.0
Browse files Browse the repository at this point in the history
  • Loading branch information
Trinovantes committed Oct 6, 2022
1 parent 1e5ff48 commit 259a416
Show file tree
Hide file tree
Showing 2 changed files with 8 additions and 20 deletions.
6 changes: 6 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,9 @@
# Quasar Unused Plugin

This document only contains breaking changes

## 0.2.0

* Require `quasar >= 2.9 && < 3` due to `quasar` changing its source file locations

* No longer required to change imports to `quasar/src/index.all` - this plugin will automatically rewrite `import ... from 'quasar'` to `import ... from 'quasar/src/index.prod.js'`
22 changes: 2 additions & 20 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Quasar Unused Plugin

This is a Webpack 5 plugin for tree shaking unused Quasar components from generated bundles. If you are using Quasar as a standalone UI library with Webpack, then you will be importing from `node_modules/quasar/dist/quasar.esm.prod.js`. However, Webpack cannot tree shake unused components from this file because this file contains circular references. We can instead import the source code from `quasar/src/index.all` and use this plugin to break the dependency chain.
This is a Webpack 5 plugin for tree shaking unused Quasar components from generated bundles. If you are using Quasar as a standalone UI library with Webpack, then you will be importing from `node_modules/quasar/dist/quasar.esm.prod.js`. However, Webpack cannot tree shake unused components from this file because this file contains circular references. We can instead import the source code from `quasar/src/index.prod.js` and use this plugin to break the dependency chain.

```ts
import { QuasarUnusedPlugin } from 'quasar-unused-plugin'
Expand All @@ -12,25 +12,7 @@ export default {
}
```

Update your imports from `quasar` to `quasar/src/index.all`

```ts
import { createApp } from 'vue'
import { Quasar } from 'quasar/src/index.all'

const app = createApp(App)
app.use(Quasar, {})
```

If you are using TypeScript, you need to create a definition file (e.g. `quasar.d.ts`) for `quasar/src/index.all`

```ts
declare module 'quasar/src/index.all' {
export * from 'quasar'
}
```

If you are externalizing node modules, you need to allowlist quasar
If you are externalizing node modules, you need to allowlist `quasar` so that Webpack can process this package.

```ts
import nodeExternals from 'webpack-node-externals'
Expand Down

0 comments on commit 259a416

Please sign in to comment.