Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/benmerckx/esbx
A collection of esbuild plugins
https://github.com/benmerckx/esbx
Last synced: 26 days ago
JSON representation
A collection of esbuild plugins
- Host: GitHub
- URL: https://github.com/benmerckx/esbx
- Owner: benmerckx
- Created: 2022-01-10T14:49:41.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2022-06-02T14:36:17.000Z (over 2 years ago)
- Last Synced: 2024-04-29T23:14:28.289Z (9 months ago)
- Language: TypeScript
- Homepage:
- Size: 944 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# esbx
A collection of [esbuild](https://esbuild.github.io) plugins
## [@esbx/alias](packages/alias)
Alias paths. Resolved paths must be absolute.
> **Note:** esbuild supports the tsconfig paths option, which can often be used to achieve the same
```ts
type AliasPluginOptions = {
[key: string]: string
}
// Example: Re-map the react packages to preact/compat
import {AliasPlugin} from '@esbx/alias'
await build({
// ...
plugins: [
AliasPlugin.configure({
react: require.resolve('preact/compat'),
'react-dom': require.resolve('preact/compat')
})
]
})
```
## [@esbx/eval](packages/eval)
Evaluate and then bundle the default export as JavaScript.
```ts
// Example: evaluate eval.js
import {EvalPlugin} from '@esbx/eval'
await build({
// ...
plugins: [EvalPlugin]
})
// eval.js
export default 'console.log("hello")'
// main.js
import 'eval:./eval.js'
// -> out.js
console.log('hello')
```
## [@esbx/extension](packages/extension)
Adds the `.js` out extension (configureable through [outExtension](https://esbuild.github.io/api/#out-extension)) to relative imports and marks them as external.
```ts
// Example: append extension to imports
import {ExtensionPlugin} from '@esbx/extension'
await build({
// ...
plugins: [ExtensionPlugin]
})
```
## [@esbx/external](packages/external)
Marks paths as external.
```ts
type ExternalPluginResponse = void | boolean | string
type ExternalPluginOptions = {
filter?: RegExp
// Boolean returns marks import as external,
// string return rewrites import
onResolve?: (
args: OnResolveArgs
) => ExternalPluginResponse | Promise
}
// Example: mark all 'external:...' imports as external
import {ExternalPlugin} from '@esbx/external'
await build({
// ...
plugins: [
ExternalPlugin.configure({
filter: /external:.*/
})
]
})
```
## [@esbx/legacy](packages/legacy)
Use [swc](https://swc.rs) to compile JavaScript to ES5. Configured for IE11 compatibility by default.
```ts
type LegacyPluginOptions = {
filter?: RegExp
exclude?: Array
swcOptions?: SwcOptions
}
// Example: compile to ES5 for IE11
import {LegacyPlugin} from '@esbx/legacy'
await build({
// ...
plugins: [LegacyPlugin]
})
```
## [@esbx/react](packages/react)
Injects `React` import automatically (no need to import `React` to use JSX).
```ts
type ReactPluginOptions = {
// Import react packages from 'preact/compat'
usePreact?: boolean
}
// Example: inject react
import {ReactPlugin} from '@esbx/react'
await build({
// ...
plugins: [ReactPlugin]
})
```
## [@esbx/reload](packages/reload)
Reload the browser on source file changes.
```ts
// Example: reload browser on file changes
import {ReloadPlugin} from '@esbx/reload'
await build({
// ...
plugins: [ReloadPlugin]
})
```
## [@esbx/reporter](packages/reporter)
Report build times.
```ts
type ReporterPluginOptions = {
name?: string
}
// Example: report build time
import {ReporterPlugin} from '@esbx/reporter'
await build({
// ...
plugins: [ReporterPlugin.configure({name: 'Server'})]
})
```
## [@esbx/run](packages/run)
Run or restart a command on successful builds.
```ts
type RunPluginOptions = {
cmd: string
} & SpawnOptions
// Example: start server after building
import {RunPlugin} from '@esbx/run'
await build({
// ...
plugins: [
RunPlugin.configure({
command: 'node server.js'
})
]
})
```
## [@esbx/sass](packages/sass)
Compile sass to css. Includes support for css modules and post css plugins.
```ts
type SassPluginOptions = {
moduleOptions: CssModulesOptions
scssOptions: SassOptions<'sync'>
postCssPlugins?: Array
}
// Example: compile sass and define css module options
import {SassPlugin} from '@esbx/sass'
await build({
// ...
plugins: [
SassPlugin.configure({
moduleOptions: {
localsConvention: 'dashes'
}
})
]
})
```
## [@esbx/static](packages/static)
Bundle static assets directory alongside generated code.
```ts
type StaticPluginOptions = {
// Defaults to 'static'
destination?: string
// Set source dir in case no entryPoints are available at build time
sources?: Array
}
// Example: copy [entry]/static to [output]/static
import {StaticPlugin} from '@esbx/static'
await build({
// ...
plugins: [StaticPlugin]
})
```
## [@esbx/summary](packages/summary)
Allows to analyze imported module size by printing a small summary of build sizes.
```ts
// Example: show a summary of imported module sizes after building
import {SummaryPlugin} from '@esbx/summary'
await build({
// ...
plugins: [SummaryPlugin]
})
```
## [@esbx/swc](packages/swc)
Use [swc](https://swc.rs) to process JavaScript.
```ts
type SwcPluginOptions = {
filter?: RegExp
exclude?: Array
swcOptions?: SwcOptions
}
// Example: use SWC with build options
import {SwcPlugin} from '@esbx/swc'
await build({
// ...
plugins: [
SwcPlugin.configure({
swcOptions: {
jsc: {
target: 'es5',
loose: false,
externalHelpers: false,
keepClassNames: false
}
}
})
]
})
```