├── .gitignore
├── .npmrc
├── .nvmrc
├── README.md
├── esbuild-plugins
├── esbuild-plugin-minify-css.js
├── esbuild-plugin-minify-html.js
└── index.js
├── lib
├── cli.js
├── default.config.js
├── index.js
└── util.js
├── package-lock.json
├── package.json
├── post-builds
├── copy.js
├── index.js
├── inject-esbuild-result.js
├── readme-to-html.js
├── run-static-server.js
├── watch-and-reload.js
└── websocket-clients.js
└── test
├── cli-1.spec.js
├── cli-2.spec.js
├── cli-3.spec.js
├── esbuild-plugins-spec.js
├── index.spec.js
├── post-builds
├── copy.spec.js
├── inject-esbuild-result.spec.js
├── run-static-server.spec.js
└── watch-and-reload.spec.js
└── test-files
├── excludes
└── foo.html
├── index.html
├── main.js
├── test.css
└── test.html
/.gitignore:
--------------------------------------------------------------------------------
1 | node_modules
--------------------------------------------------------------------------------
/.npmrc:
--------------------------------------------------------------------------------
1 | registry=https://registry.npmjs.com
2 |
--------------------------------------------------------------------------------
/.nvmrc:
--------------------------------------------------------------------------------
1 | 15
2 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # esbuild-x
2 | [esbuid](https://esbuild.github.io/) extended; esbuild + pre/post builds
3 |
4 | ## Features
5 | * esbuild CLI available (since it's a dependency)
6 | * esbuild npm available (since it's a dependency)
7 | * plus, accepting configuration file (e.g., `esbuild.config.js`)
8 | * plus, accepting custom pre build functions
9 | * plus, accepting custom post build functions
10 |
11 | ## Install
12 | ```
13 | $ npm i esbuild-x -D
14 | ```
15 |
16 | ## Usage as command
17 | ```
18 | $ esbuild main.js --bundle
19 | $ esbuild-x --config=esbuild.config.js
20 | $ esbuild-x build
21 | $ esbuild-x serve
22 | ```
23 |
24 | ## Usage as node module
25 | ```
26 | // esbuild as it is
27 | const esbuild = require('esbuild');
28 | esbuild.build({
29 | entryPoints: ['src/main.js'],
30 | entryNames: '[name]-[hash]',
31 | outdir: 'dist',
32 | bundle: true
33 | })
34 |
35 | // or esbuildX along with pre/post builds extended
36 | const esbuildX = require('esbuild-x');
37 | esbuildX.build({
38 | entryPoints: ['src/main.js'],
39 | entryNames: '[name]-[hash]',
40 | outdir: 'dist',
41 | bundle: true,
42 | preBuilds: [ function() {rimraf('dist')} ],
43 | postBuilds: [ function() {console.log('done')} ]
44 | })
45 | ```
46 |
47 | ## esbuild-x.config.js example
48 | * all esbuild options are allowed, https://esbuild.github.io/api/#build-api.
49 | * preBuilds: an array of function to run before esbuild.build()
50 | Example
51 | ```
52 | module.exports = {
53 | build: {
54 | entryPoints: ['src/main.js'],
55 | entryNames: '[name]-[hash]',
56 | outdir: 'dist',
57 | bundle: true,
58 | ...
59 | preBuilds: [ function clear() {rimraf('dist')} ],
60 | ...
61 | }
62 | }
63 | ```
64 |
65 | * postBuilds: an array of function to run after esbuild.build().
66 | a post build function takes two parameters internally
67 | * esbuild option
68 | * esbuild result
69 | ```
70 | module.exports = {
71 | build: {
72 | entryPoints: ['src/main.js'],
73 | entryNames: '[name]-[hash]',
74 | outdir: 'dist',
75 | bundle: true,
76 | ...
77 | postBuilds: [
78 | async function(_, result) { // bundle analyzer
79 | let text = await esbuild.analyzeMetafile(result.metafile, {verbose: true});
80 | console.log(text);
81 | }
82 | ]
83 | }
84 | }
85 | ```
86 | A full example can be found here.
87 | https://github.com/elements-x/elements-x/blob/master/esbuild-x.config.js
88 |
89 | ## built-in esbuild plugins
90 |
91 | ### minifyCssPlugin / minifyHtmlPlubin
92 | esbuild plugin that minify css and html
93 | * Read .css files as a minified text, not as css object.
94 | * Read .html files as a minified text
95 |
96 | src/main.js
97 | ```
98 | import html from './test.html';
99 | import css from './test.css';
100 | console.log(html + css);
101 | ```
102 |
103 | Example
104 | ```
105 | const esbuildX = require('esbuild-x');
106 | const { minifyCssPlugin, minifyHtmlPlugin } = esbuildX.plugins;
107 | const options = {
108 | entryPoints: ['src/main.js'],
109 | plugins: [minifyCssPlugin, minifyHtmlPlugin]
110 | };
111 | esbuildX.build(options).then(esbuildResult => {
112 | ...
113 | });
114 | ```
115 |
116 | ## built-in post builds
117 |
118 | ### copy
119 | copy files to a directory by replacing file contents
120 |
121 | #### parameters
122 | * fromsTo: string. Accepts glob patterns. e.g., 'src/**/!(*.js) public/* dist'
123 | * options:
124 | * replacements: list of replacement objects
125 | * match: replacement happens when this regular expression match to a file path.
126 | * find: regular expression to search string in a file.
127 | * replace: string value to replace the string found.
128 | * excludes: list of exclude patterns.
129 |
130 | Example
131 | ```
132 | const esbuildX = require('esbuild-x');
133 | const {copy} = esbuildX.postBuilds
134 | const options = {
135 | entryPoints: ['src/main.js']
136 | postBuilds: [
137 | copy('src/**/!(*.js) public/* dist', {
138 | replacements: [ {match: /index\.html/, find: /FOO/, replace: 'BAR'} ],
139 | excludes: [/node_moules/]
140 | })
141 | ]
142 | }
143 | esbuildX.build(options).then(esbuildResult => {
144 | ...
145 | })
146 | ```
147 |
148 | ### injectEsbuildResult
149 | Inject esbuild compile output to index.html.
150 |
151 | e.g.
152 | ```
153 |
154 |
155 |
156 |
157 |