@reflex-stack/tsp 0.1.10 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +36 -41
- package/package.json +4 -4
- package/src/cli.js +19 -15
- package/src/commands/init.js +65 -27
- package/src/commands/size-report.js +29 -34
- package/src/config.js +0 -2
- package/src/tests.js +1 -4
- package/src/utils.js +5 -3
- package/tests/example-package/LICENCE +0 -21
- package/tests/example-package/README.md +0 -31
- package/tests/example-package/dist/common-dep.d.ts +0 -1
- package/tests/example-package/dist/common-dep.js +0 -1
- package/tests/example-package/dist/index.d.ts +0 -2
- package/tests/example-package/dist/index.js +0 -2
- package/tests/example-package/dist/root-dep.d.ts +0 -1
- package/tests/example-package/dist/root-dep.js +0 -1
- package/tests/example-package/dist/stuff.d.ts +0 -1
- package/tests/example-package/dist/stuff.js +0 -5
- package/tests/example-package/dist/submodule/index.d.ts +0 -1
- package/tests/example-package/dist/submodule/index.js +0 -5
- package/tests/example-package/dist/submodule/submodule-dep.d.ts +0 -1
- package/tests/example-package/dist/submodule/submodule-dep.js +0 -1
- package/tests/example-package/package-lock.json +0 -1061
- package/tests/example-package/package.json +0 -47
- package/tests/example-package/reports/main-dark.svg +0 -1
- package/tests/example-package/reports/main-light.svg +0 -1
- package/tests/example-package/reports/submodule-dark.svg +0 -1
- package/tests/example-package/reports/submodule-light.svg +0 -1
- package/tests/example-package/reports/total-dark.svg +0 -1
- package/tests/example-package/reports/total-light.svg +0 -1
- package/tests/example-package/tests/test.js +0 -25
- package/tests/example-package/tests/tsconfig.json +0 -5
- package/tests/example-package/tsconfig.json +0 -36
package/README.md
CHANGED
|
@@ -6,23 +6,29 @@
|
|
|
6
6
|
- It uses `tsc` to compile from ts to js and check errors
|
|
7
7
|
- Generates `.d.ts` to keep types when used
|
|
8
8
|
- Scaffold new packages in 1 minute
|
|
9
|
-
- Testing lib pre-installed, can also use your own or skip tests
|
|
10
|
-
- Generating size report
|
|
9
|
+
- Testing lib pre-installed, can also use your own or skip tests (will use `bun:test` if the runtime is Bun)
|
|
10
|
+
- Generating size report and replace them with tags in `README.md` for Npm and GitHub
|
|
11
11
|
- Compatible with latest **Node** / **Bun** / **Deno** and all bundlers with ecma specification
|
|
12
|
-
- Publishing under `.js` and `.d.ts` [helps having better performances](https://x.com/mattpocockuk/status/1872945584761651432) in your projects
|
|
12
|
+
- Publishing under `.js` and `.d.ts` [helps having better performances](https://x.com/mattpocockuk/status/1872945584761651432) in your projects.
|
|
13
13
|
|
|
14
|
-
Check example on [NPM](https://www.npmjs.com/package/@reflex-stack/tsp-example) and [GitHub](https://github.com/reflex-stack/tsp/tree/main/tests/example
|
|
14
|
+
Check example on [NPM](https://www.npmjs.com/package/@reflex-stack/tsp-bun-example) and [GitHub](https://github.com/reflex-stack/tsp/tree/main/tests/tsp-bun-example)
|
|
15
15
|
|
|
16
16
|
## Init a new TypeScript Package
|
|
17
17
|
|
|
18
|
-
First, create the associated **git repository** for your package and clone it (
|
|
18
|
+
First, create the associated **git repository** for your package and clone it (optional).
|
|
19
19
|
|
|
20
20
|
Then, run this command in the cloned directory. :
|
|
21
|
+
|
|
22
|
+
#### To create a package managed with Bun
|
|
21
23
|
```bash
|
|
22
|
-
|
|
24
|
+
bunx @reflex-stack/tsp init
|
|
23
25
|
```
|
|
24
26
|
|
|
25
|
-
|
|
27
|
+
#### To create a package managed with Node
|
|
28
|
+
```bash
|
|
29
|
+
npx @reflex-stack/tsp init
|
|
30
|
+
```
|
|
31
|
+
> If you create this package in a mono-repo, `cd` in the correct repository before running this command. The subdirectory is important for package.json to be in the right place.
|
|
26
32
|
|
|
27
33
|
#### Created files
|
|
28
34
|
|
|
@@ -35,11 +41,11 @@ This will ask some questions and create those files. It contains 1 **submodule**
|
|
|
35
41
|
│ │ └─ index.ts
|
|
36
42
|
│ └─ index.ts
|
|
37
43
|
├─ tests/
|
|
38
|
-
│ └─ test.js
|
|
39
|
-
│ └─ tsconfig.json ( to have correct typings in test.js
|
|
44
|
+
│ └─ test.(js|ts)
|
|
45
|
+
│ └─ tsconfig.json (if Node runtime, to have correct typings in test.js)
|
|
40
46
|
├─ .gitignore
|
|
41
47
|
├─ .npmignore
|
|
42
|
-
├─ LICENSE (
|
|
48
|
+
├─ LICENSE (if MIT)
|
|
43
49
|
├─ package.json
|
|
44
50
|
├─ package-lock.json
|
|
45
51
|
├─ README.md
|
|
@@ -50,56 +56,46 @@ This will ask some questions and create those files. It contains 1 **submodule**
|
|
|
50
56
|
|
|
51
57
|
#### Build sources
|
|
52
58
|
```shell
|
|
59
|
+
bun run build
|
|
60
|
+
# or
|
|
53
61
|
npm run build
|
|
54
62
|
```
|
|
55
63
|
- Will clear `./dist`, build sources from `.ts` files to `.js` and `.d.ts` files.
|
|
56
|
-
- Will generate size report and generate `./reports` directory with JSON and SVG files.
|
|
57
64
|
|
|
58
65
|
> Run `npm run build --noSizeReport` to skip size report entirely.
|
|
59
66
|
|
|
60
67
|
#### Test
|
|
61
68
|
```bash
|
|
69
|
+
bun run test
|
|
70
|
+
# or
|
|
62
71
|
npm run test
|
|
63
72
|
```
|
|
64
73
|
> Will clear `./dist`, build sources and run tests. No size report.
|
|
65
74
|
|
|
66
75
|
#### Publish
|
|
67
76
|
```bash
|
|
77
|
+
bun run publish
|
|
78
|
+
# or
|
|
68
79
|
npm run publish
|
|
69
80
|
```
|
|
81
|
+
|
|
70
82
|
> Will clear `./dist`, build sources, run tests, and start publish process.
|
|
71
83
|
> This will ask you how to upgrade package.json version, push to git and npm.
|
|
72
84
|
|
|
73
85
|
|
|
74
86
|
## Size report
|
|
75
87
|
|
|
76
|
-
**TSP** can generate size reports with brotli compression.
|
|
77
|
-
- 2 svgs for root module
|
|
78
|
-
- 2 svgs by submodule
|
|
79
|
-
- 2 svgs for total if you have submodules
|
|
80
|
-
|
|
81
|
-
There are 2 svgs generated, for dark and light mode, to be included in the README.md, on **GitHub** and **NPM**.
|
|
82
|
-
|
|
83
|
-
> When scaffolded, an example of SVG inclusion is generated in README.md
|
|
84
|
-
|
|
85
|
-
How to include the size report in `README.md` ?
|
|
86
|
-
|
|
87
|
-
```html
|
|
88
|
-
Main bundle is <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./reports/main-dark.svg"><img src="./reports/main-light.svg"></picture>,
|
|
89
|
-
submodule is <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./reports/submodule-dark.svg"><img src="./reports/submodule-light.svg"></picture>,
|
|
90
|
-
total is <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./reports/total-dark.svg"><img src="./reports/total-light.svg"></picture>
|
|
91
|
-
```
|
|
88
|
+
**TSP** can generate size reports with brotli compression.
|
|
92
89
|
|
|
93
|
-
|
|
90
|
+
Use `<bundle-size id="{bundleID}">0b</bundle-size>` tags in your `README.md` to include size reports.
|
|
91
|
+
Replace `{bundleID}` with the name of the bundle you want to include.
|
|
92
|
+
Those tags will be replaced each time you run `npm run build`.
|
|
94
93
|
|
|
95
|
-
|
|
96
|
-
submodule is <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./tests/example-package/reports/submodule-dark.svg"><img src="./tests/example-package/reports/submodule-light.svg"></picture>,
|
|
97
|
-
total is <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./tests/example-package/reports/total-dark.svg"><img src="./tests/example-package/reports/total-light.svg"></picture>
|
|
94
|
+
For the total bundle size, use `<bundle-size id="total">0b</bundle-size>`
|
|
98
95
|
|
|
99
|
-
>
|
|
100
|
-
> This can be disabled in package.json at `tsp.generate-svg-report`
|
|
96
|
+
> Works in GitHub and NPM.
|
|
101
97
|
|
|
102
|
-
**TSP** can also generate a json size report if needed (
|
|
98
|
+
**TSP** can also generate a json size report as `bundle-sizes.json` if needed (default is set to false)
|
|
103
99
|
|
|
104
100
|
## TSP config
|
|
105
101
|
TSP config is in the generated `package.json` under the `"tsp"` node
|
|
@@ -107,22 +103,21 @@ TSP config is in the generated `package.json` under the `"tsp"` node
|
|
|
107
103
|
```json5
|
|
108
104
|
{
|
|
109
105
|
"tsp": {
|
|
110
|
-
// Can set to "
|
|
111
|
-
"runtime": "
|
|
106
|
+
// Can set to "node" or "deno"
|
|
107
|
+
"runtime": "bun",
|
|
112
108
|
// If you change them, you should update tsconfig.json file
|
|
113
109
|
"src": './src',
|
|
114
110
|
"dist": './dist',
|
|
115
111
|
"tests": './tests',
|
|
116
112
|
"tmp": './tmp',
|
|
117
113
|
// Add your test files here
|
|
118
|
-
"test-files": ['test.
|
|
114
|
+
"test-files": ['test.ts'],
|
|
119
115
|
// Where size reports are generated
|
|
120
|
-
"
|
|
121
|
-
"generate-json-report": false,
|
|
122
|
-
"generate-svg-report": true
|
|
116
|
+
"generate-json-report": false
|
|
123
117
|
},
|
|
124
118
|
}
|
|
125
119
|
```
|
|
126
120
|
|
|
127
121
|
## Next features
|
|
128
|
-
- [ ]
|
|
122
|
+
- [ ] Set other files than `README.md` in config for size report tags
|
|
123
|
+
- [ ] Docisfy integration
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@reflex-stack/tsp",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0",
|
|
4
4
|
"type": "module",
|
|
5
5
|
"bin": {
|
|
6
6
|
"tsp": "./src/cli.js"
|
|
@@ -23,12 +23,12 @@
|
|
|
23
23
|
"license": "MIT",
|
|
24
24
|
"description": "TSP scaffolds and build Typescript sources to EcmaScript modules and publish them as modular packages to NPM",
|
|
25
25
|
"dependencies": {
|
|
26
|
-
"@types/node": "^
|
|
26
|
+
"@types/node": "^25.5.0",
|
|
27
27
|
"@zouloux/cli": "^0.2.8",
|
|
28
28
|
"@zouloux/files": "^3.0.4",
|
|
29
29
|
"brotli-size": "^4.0.0",
|
|
30
30
|
"stach": "^2.0.1",
|
|
31
|
-
"terser": "^5.
|
|
32
|
-
"typescript": "^
|
|
31
|
+
"terser": "^5.46.1",
|
|
32
|
+
"typescript": "^6.0.2"
|
|
33
33
|
}
|
|
34
34
|
}
|
package/src/cli.js
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
import { askInput, CLICommands, execAsync, nicePrint, oraTask, execSync, table, askList, newLine } from "@zouloux/cli";
|
|
5
5
|
import { build, clearOutput } from "./commands/build.js";
|
|
6
6
|
import { getUserPackageJson, naiveHumanFileSize, showIntroMessage } from "./utils.js";
|
|
7
|
-
import {
|
|
7
|
+
import { generateJSON, replaceBundleSizes, sizeReport } from "./commands/size-report.js";
|
|
8
8
|
import { init } from "./commands/init.js";
|
|
9
9
|
import { getConfig } from "./config.js";
|
|
10
10
|
|
|
@@ -68,20 +68,18 @@ commands.add("build", async (args, flags) => {
|
|
|
68
68
|
return report
|
|
69
69
|
})
|
|
70
70
|
|
|
71
|
-
// Generate
|
|
72
|
-
if ( config["generate-
|
|
73
|
-
await oraTask('Generating report
|
|
74
|
-
|
|
75
|
-
await cleanSizeReports( config )
|
|
76
|
-
// Generate JSON
|
|
77
|
-
if ( config["generate-json-report"] )
|
|
78
|
-
generateJSON( report, config )
|
|
79
|
-
// Generate SVG files
|
|
80
|
-
if ( config["generate-svg-report"] )
|
|
81
|
-
await generateSVGs( report, config )
|
|
71
|
+
// Generate JSON report
|
|
72
|
+
if ( config["generate-json-report"] ) {
|
|
73
|
+
await oraTask('Generating json report', async ( task ) => {
|
|
74
|
+
generateJSON( report, config )
|
|
82
75
|
})
|
|
83
76
|
}
|
|
84
77
|
|
|
78
|
+
// Replace bundle sizes
|
|
79
|
+
await oraTask('Replacing bundle sizes', async ( task ) => {
|
|
80
|
+
await replaceBundleSizes( report, config )
|
|
81
|
+
})
|
|
82
|
+
|
|
85
83
|
// Print report table in CLI
|
|
86
84
|
const tableData = [
|
|
87
85
|
// Table header
|
|
@@ -142,7 +140,11 @@ commands.add("test", async (args, flags, commandName) => {
|
|
|
142
140
|
nicePrint(`Starting test sequence`)
|
|
143
141
|
newLine()
|
|
144
142
|
for ( const testFile of config["test-files"] ) {
|
|
145
|
-
const command =
|
|
143
|
+
const command = (
|
|
144
|
+
config.runtime === "node"
|
|
145
|
+
? `node ${config.tests}/${testFile}`
|
|
146
|
+
: `bun test ${config.tests}/${testFile}`
|
|
147
|
+
)
|
|
146
148
|
nicePrint(`{d}$ ${command}`)
|
|
147
149
|
try {
|
|
148
150
|
await execAsync(command, 3)
|
|
@@ -235,8 +237,10 @@ commands.add("publish", async (args, flags, commandName) => {
|
|
|
235
237
|
commands.start(function (commandName) {
|
|
236
238
|
if ( commandName )
|
|
237
239
|
return
|
|
238
|
-
|
|
239
|
-
|
|
240
|
+
if ( commandName !== undefined ) {
|
|
241
|
+
nicePrint(`{b/r}Command '${commandName}' not found`)
|
|
242
|
+
newLine()
|
|
243
|
+
}
|
|
240
244
|
nicePrint(`Available commands :`)
|
|
241
245
|
commands.list().forEach( command => nicePrint(`- ${command}`) )
|
|
242
246
|
})
|
package/src/commands/init.js
CHANGED
|
@@ -6,6 +6,9 @@ import { Stach } from "stach";
|
|
|
6
6
|
import { mkdirSync } from "fs";
|
|
7
7
|
import { join } from "node:path";
|
|
8
8
|
|
|
9
|
+
const runtime = typeof Bun === "undefined" ? "node" : "bun"
|
|
10
|
+
const packageManager = runtime === "node" ? "npm" : "bun"
|
|
11
|
+
|
|
9
12
|
const licenseTemplate = `MIT License
|
|
10
13
|
|
|
11
14
|
Copyright (c) {{ year }} {{ authorName }}
|
|
@@ -29,12 +32,13 @@ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
|
29
32
|
SOFTWARE.`
|
|
30
33
|
|
|
31
34
|
const readmeTemplate = `# {{ packageTextName }}
|
|
32
|
-
Main bundle is <
|
|
33
|
-
and optional submodule is only <
|
|
35
|
+
Main bundle is <bundle-size id="main">0b</bundle-size>
|
|
36
|
+
and optional submodule is only <bundle-size id="submodule">0b</bundle-size>.
|
|
37
|
+
For a total of <bundle-size id="total">0b</bundle-size>
|
|
34
38
|
|
|
35
39
|
## Install
|
|
36
40
|
|
|
37
|
-
|
|
41
|
+
\`${packageManager} i {{ packageNPMName }}\`
|
|
38
42
|
|
|
39
43
|
## Usage
|
|
40
44
|
|
|
@@ -47,11 +51,11 @@ and optional submodule is only <picture style="display: inline-block"><source me
|
|
|
47
51
|
## Build commands
|
|
48
52
|
|
|
49
53
|
##### Build
|
|
50
|
-
-
|
|
54
|
+
- \`${runtime} run build\`
|
|
51
55
|
##### Test
|
|
52
|
-
-
|
|
56
|
+
- \`${runtime} run test\`
|
|
53
57
|
##### Publish
|
|
54
|
-
-
|
|
58
|
+
- \`${runtime} run publish\`
|
|
55
59
|
|
|
56
60
|
---
|
|
57
61
|
## TSP
|
|
@@ -72,13 +76,14 @@ const tsconfigTemplate = `{
|
|
|
72
76
|
"lib": [{{libs}}],
|
|
73
77
|
// Module config, you should not change it
|
|
74
78
|
"module": "NodeNext",
|
|
75
|
-
"moduleResolution": "
|
|
79
|
+
"moduleResolution": "NodeNext",
|
|
76
80
|
"isolatedModules": false,
|
|
77
81
|
"allowImportingTsExtensions": false,
|
|
78
82
|
// Compiler config
|
|
79
83
|
"strict": {{tsStrict}},
|
|
80
84
|
"useDefineForClassFields" : true,
|
|
81
85
|
"allowSyntheticDefaultImports": true,
|
|
86
|
+
"skipLibCheck": true,
|
|
82
87
|
// ---
|
|
83
88
|
// Feel free to configure this file for your needs
|
|
84
89
|
// https://www.typescriptlang.org/tsconfig/
|
|
@@ -103,13 +108,16 @@ const tsconfigTestTemplate = `{
|
|
|
103
108
|
|
|
104
109
|
const gitIgnoreTemplate = `.DS_Store
|
|
105
110
|
.idea
|
|
111
|
+
.vscode
|
|
106
112
|
tmp
|
|
107
113
|
node_modules
|
|
108
114
|
dist
|
|
109
115
|
`
|
|
110
116
|
|
|
111
117
|
const npmIgnoreTemplate = `.DS_Store
|
|
118
|
+
.DS_Store
|
|
112
119
|
.idea
|
|
120
|
+
.vscode
|
|
113
121
|
LICENSE
|
|
114
122
|
tmp/
|
|
115
123
|
src/
|
|
@@ -134,7 +142,7 @@ export function subRandomFunction () {
|
|
|
134
142
|
}
|
|
135
143
|
`
|
|
136
144
|
|
|
137
|
-
const
|
|
145
|
+
const testFileNode = `// If you have no tests, uncomment this
|
|
138
146
|
// console.log("No test implemented.")
|
|
139
147
|
// process.exit(0)
|
|
140
148
|
|
|
@@ -142,24 +150,24 @@ const testFile = `// If you have no tests, uncomment this
|
|
|
142
150
|
import { randomFunction } from "../dist/index.js"
|
|
143
151
|
import { subRandomFunction } from "../dist/submodule/index.js"
|
|
144
152
|
// Import small testing lib from tsp
|
|
145
|
-
import { describe,
|
|
153
|
+
import { describe, test, expect, startTest } from "@reflex-stack/tsp/tests"
|
|
146
154
|
|
|
147
155
|
const endTest = startTest()
|
|
148
156
|
|
|
149
157
|
describe("Main module", () => {
|
|
150
|
-
|
|
158
|
+
test("Should call random", () => {
|
|
151
159
|
const rootResult = randomFunction()
|
|
152
160
|
expect(rootResult).toBe(5)
|
|
153
161
|
})
|
|
154
162
|
})
|
|
155
163
|
|
|
156
164
|
describe("Sub module", () => {
|
|
157
|
-
|
|
165
|
+
test("Should call sub random", () => {
|
|
158
166
|
const subResult = subRandomFunction()
|
|
159
167
|
expect(subResult).toBe(60)
|
|
160
168
|
})
|
|
161
169
|
// Test error example
|
|
162
|
-
//
|
|
170
|
+
// test("Should fail", () => {
|
|
163
171
|
// expect(5).toBe(12)
|
|
164
172
|
// })
|
|
165
173
|
})
|
|
@@ -167,6 +175,35 @@ describe("Sub module", () => {
|
|
|
167
175
|
endTest()
|
|
168
176
|
`
|
|
169
177
|
|
|
178
|
+
const testFileBun = `// If you have no tests, uncomment this
|
|
179
|
+
// console.log("No test implemented.")
|
|
180
|
+
// process.exit(0)
|
|
181
|
+
|
|
182
|
+
// Import your code directly from src directory thanks to bun
|
|
183
|
+
import { randomFunction } from "../src/index.js"
|
|
184
|
+
import { subRandomFunction } from "../src/submodule/index.js"
|
|
185
|
+
// Import Bun testing lib
|
|
186
|
+
import { describe, test, expect } from "bun:test"
|
|
187
|
+
|
|
188
|
+
describe("Main module", () => {
|
|
189
|
+
test("Should call random", () => {
|
|
190
|
+
const rootResult = randomFunction()
|
|
191
|
+
expect(rootResult).toBe(5)
|
|
192
|
+
})
|
|
193
|
+
})
|
|
194
|
+
|
|
195
|
+
describe("Sub module", () => {
|
|
196
|
+
test("Should call sub random", () => {
|
|
197
|
+
const subResult = subRandomFunction()
|
|
198
|
+
expect(subResult).toBe(60)
|
|
199
|
+
})
|
|
200
|
+
// Test error example
|
|
201
|
+
// test("Should fail", () => {
|
|
202
|
+
// expect(5).toBe(12)
|
|
203
|
+
// })
|
|
204
|
+
})
|
|
205
|
+
`
|
|
206
|
+
|
|
170
207
|
export async function init () {
|
|
171
208
|
// Check if some critical file already exists and warn before overriding
|
|
172
209
|
if ( existsSync("package.json") ) {
|
|
@@ -188,20 +225,19 @@ export async function init () {
|
|
|
188
225
|
nicePrint(`{d}Git sub directory is {/}${relativeGitSubDirectory}. This will be saved to package.json.`)
|
|
189
226
|
}
|
|
190
227
|
}
|
|
228
|
+
nicePrint(`{d}Using {b}${runtime}{/}{d} runtime. Your package will be configured to work with {b}${runtime}{/}{d}.`)
|
|
191
229
|
newLine()
|
|
192
230
|
const options = { remoteURL, relativeGitSubDirectory }
|
|
193
231
|
options.packageTextName = await askInput(`Package name, in plain text {d}ex : My Package`, { notEmpty: true })
|
|
194
232
|
options.packageNPMName = await askInput(`Package name, for NPM, with namespace {d}ex : @mynamespace/mypackage`, { notEmpty: true })
|
|
195
233
|
options.authorName = await askInput(`Author name`, { notEmpty: true })
|
|
196
234
|
options.licenseName = await askInput(`License name`, { defaultValue: "MIT" })
|
|
197
|
-
options.esLevel = await askInput(`ES Level for tsconfig`, { defaultValue: "
|
|
235
|
+
options.esLevel = await askInput(`ES Level for tsconfig`, { defaultValue: "es2024" })
|
|
198
236
|
options.tsStrict = await askList(`Use strict Typescript?`, ["Yes", "No"], { defaultIndex: 0, returnType: "index" })
|
|
199
237
|
options.domAccess = await askList(`Will it have access to DOM?`, ["Yes", "No"], { defaultIndex: 0, returnType: "index" })
|
|
200
|
-
options.svgReport = await askList(`Export SVG size report on build for README.md?`, ["Yes", "No"], { defaultIndex: 0, returnType: "index" })
|
|
201
238
|
options.jsonReport = await askList(`Export JSON size report on build?`, ["Yes", "No"], { defaultIndex: 1, returnType: "index" })
|
|
202
239
|
options.domAccess = options.domAccess === 0
|
|
203
240
|
options.tsStrict = options.tsStrict === 0
|
|
204
|
-
options.svgReport = options.svgReport === 0
|
|
205
241
|
options.jsonReport = options.jsonReport === 0
|
|
206
242
|
options.libs = [options.domAccess ? "DOM" : "", options.esLevel]
|
|
207
243
|
.filter( Boolean )
|
|
@@ -227,15 +263,13 @@ export async function init () {
|
|
|
227
263
|
}
|
|
228
264
|
},
|
|
229
265
|
tsp: {
|
|
230
|
-
runtime
|
|
266
|
+
runtime,
|
|
231
267
|
src: './src',
|
|
232
268
|
dist: './dist',
|
|
233
269
|
tests: './tests',
|
|
234
|
-
"test-files": ['test.js'],
|
|
270
|
+
"test-files": [runtime === "node" ? 'test.js' : 'test.ts'],
|
|
235
271
|
tmp: './tmp',
|
|
236
|
-
|
|
237
|
-
"generate-json-report": options.jsonReport,
|
|
238
|
-
"generate-svg-report": options.svgReport
|
|
272
|
+
"generate-json-report": options.jsonReport
|
|
239
273
|
},
|
|
240
274
|
scripts: {
|
|
241
275
|
build: "tsp build",
|
|
@@ -252,7 +286,7 @@ export async function init () {
|
|
|
252
286
|
type: "git",
|
|
253
287
|
url: options.remoteURL
|
|
254
288
|
}
|
|
255
|
-
// Add subdirectory for package.json and
|
|
289
|
+
// Add subdirectory for package.json and in README.md on NPMJs
|
|
256
290
|
if ( options.relativeGitSubDirectory ) {
|
|
257
291
|
packageJson.repository.directory = options.relativeGitSubDirectory
|
|
258
292
|
}
|
|
@@ -275,19 +309,23 @@ export async function init () {
|
|
|
275
309
|
writeFileSync(join(config.src, "index.ts"), Stach(rootIndexTs, options))
|
|
276
310
|
writeFileSync(join(config.src, "submodule", "index.ts"), Stach(subModuleIndexTs, options))
|
|
277
311
|
// Generate tests file
|
|
278
|
-
|
|
279
|
-
|
|
312
|
+
if ( runtime === "node" ) {
|
|
313
|
+
writeFileSync(join(config.tests, "test.js"), Stach(testFileNode, options))
|
|
314
|
+
writeFileSync(join(config.tests, "tsconfig.json"), Stach(tsconfigTestTemplate, options))
|
|
315
|
+
} else if ( runtime === "bun" ) {
|
|
316
|
+
writeFileSync(join(config.tests, "test.ts"), Stach(testFileBun, options))
|
|
317
|
+
}
|
|
280
318
|
// Install dependencies
|
|
281
319
|
await oraTask("Installing dependencies", async () => {
|
|
282
|
-
await execAsync(
|
|
320
|
+
await execAsync(`${packageManager} i typescript terser`, false, { cwd: config.cwd })
|
|
283
321
|
})
|
|
284
322
|
// Show commands
|
|
285
323
|
newLine()
|
|
286
324
|
nicePrint(`{b/g}Package ${options.packageNPMName} created ✨`)
|
|
287
325
|
newLine()
|
|
288
326
|
nicePrint(`Available commands :`)
|
|
289
|
-
nicePrint(`-
|
|
290
|
-
nicePrint(`-
|
|
291
|
-
nicePrint(`-
|
|
327
|
+
nicePrint(`- ${packageManager} run build`)
|
|
328
|
+
nicePrint(`- ${packageManager} run test`)
|
|
329
|
+
nicePrint(`- ${packageManager} run publish`)
|
|
292
330
|
newLine()
|
|
293
331
|
}
|
|
@@ -98,51 +98,46 @@ export async function sizeReport ( bundles, config ) {
|
|
|
98
98
|
return allBundleSizes
|
|
99
99
|
}
|
|
100
100
|
|
|
101
|
-
export async function cleanSizeReports ( config ) {
|
|
102
|
-
const dir = new Directory( join(config.cwd, config.reports) )
|
|
103
|
-
await dir.ensureParents()
|
|
104
|
-
await dir.clean()
|
|
105
|
-
}
|
|
106
|
-
|
|
107
101
|
export function generateJSON ( sizeReport, config ) {
|
|
108
102
|
writeFileSync(
|
|
109
|
-
join(config.cwd,
|
|
103
|
+
join(config.cwd, 'bundle-sizes.json'),
|
|
110
104
|
JSON.stringify( sizeReport ),
|
|
111
105
|
{ encoding: 'utf-8' }
|
|
112
106
|
)
|
|
113
107
|
}
|
|
114
108
|
|
|
115
|
-
async function
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
109
|
+
async function replaceBundleSizeInFile( filePath, id, size ) {
|
|
110
|
+
// Open file and replace tags like <bundle-size id="{id}">{size}</bundle-size>
|
|
111
|
+
// If you find any tag with any size in it, with this ID, replace the size with the new from arguments
|
|
112
|
+
// For ex: ("README.md", "main", 500b)
|
|
113
|
+
// Before: <bundle-size id="main">200b</bundle-size>
|
|
114
|
+
// After: <bundle-size id="main">500b</bundle-size>
|
|
115
|
+
// Should do it for all instances in file. Can be done sync if possible.
|
|
116
|
+
const file = new File( filePath )
|
|
117
|
+
await file.load()
|
|
118
|
+
const escapedId = id.replace( /[.*+?^${}()|[\]\\]/g, '\\$&' )
|
|
119
|
+
const regex = new RegExp( `<bundle-size id="${ escapedId }">.*?</bundle-size>`, 'g' )
|
|
120
|
+
file.content( ( content ) => {
|
|
121
|
+
return content.replaceAll( regex, `<bundle-size id="${ id }">${ size }</bundle-size>` )
|
|
122
|
+
})
|
|
123
|
+
await file.save()
|
|
128
124
|
}
|
|
129
125
|
|
|
130
|
-
export async function
|
|
126
|
+
export async function replaceBundleSizes ( sizeReport, config ) {
|
|
127
|
+
const files = ["README.md"] // fixme add config
|
|
131
128
|
let total = 0
|
|
132
|
-
for (
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
const
|
|
138
|
-
await
|
|
129
|
+
for (const file of files) {
|
|
130
|
+
// Per bundle size
|
|
131
|
+
for ( const bundle of sizeReport ) {
|
|
132
|
+
const size = bundle.sizes[2]
|
|
133
|
+
total += size
|
|
134
|
+
const sizeContent = naiveHumanFileSize( size )
|
|
135
|
+
await replaceBundleSizeInFile(file, bundle.name, sizeContent)
|
|
139
136
|
}
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
const filePath = join( config.cwd, config.reports, `total-${scheme}.svg` )
|
|
145
|
-
await generateTextSVG( filePath, scheme, sizeContent )
|
|
137
|
+
// Total size
|
|
138
|
+
if ( sizeReport.length > 1 ) {
|
|
139
|
+
const sizeContent = naiveHumanFileSize( total )
|
|
140
|
+
await replaceBundleSizeInFile(file, "total", sizeContent)
|
|
146
141
|
}
|
|
147
142
|
}
|
|
148
143
|
}
|
package/src/config.js
CHANGED
|
@@ -9,9 +9,7 @@ export let getConfig = (userPackage) => {
|
|
|
9
9
|
tests: './tests',
|
|
10
10
|
"test-files": ['test.js'],
|
|
11
11
|
tmp: './tmp',
|
|
12
|
-
reports: './reports',
|
|
13
12
|
'generate-json-report': true,
|
|
14
|
-
'generate-svg-report': true,
|
|
15
13
|
// Override with package config
|
|
16
14
|
...((userPackage ?? {})['tsp'] ?? {})
|
|
17
15
|
}
|
package/src/tests.js
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
|
|
2
|
-
|
|
3
2
|
let total = 0
|
|
4
3
|
let success = 0
|
|
5
4
|
let failed = 0
|
|
@@ -14,14 +13,12 @@ export function startTest () {
|
|
|
14
13
|
}
|
|
15
14
|
}
|
|
16
15
|
|
|
17
|
-
|
|
18
|
-
|
|
19
16
|
export const describe = ( name, fn ) => {
|
|
20
17
|
console.log(`${ name }`)
|
|
21
18
|
fn()
|
|
22
19
|
}
|
|
23
20
|
|
|
24
|
-
export const
|
|
21
|
+
export const test = ( name, fn ) => {
|
|
25
22
|
++total
|
|
26
23
|
try {
|
|
27
24
|
fn()
|
package/src/utils.js
CHANGED
|
@@ -45,9 +45,11 @@ export function showIntroMessage ( noThrow = false ) {
|
|
|
45
45
|
* Very naive implementation.
|
|
46
46
|
*/
|
|
47
47
|
export function naiveHumanFileSize ( size ) {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
48
|
+
if ( size >= 1000000 )
|
|
49
|
+
size = ~~( size / 10000 ) / 100 + 'mb'
|
|
50
|
+
else if ( size >= 1000 )
|
|
51
|
+
size = ~~( size / 10 ) / 100 + 'kb'
|
|
52
|
+
return size + 'b'
|
|
51
53
|
}
|
|
52
54
|
|
|
53
55
|
// Get git remote repo URL if in a git repo
|
|
@@ -1,21 +0,0 @@
|
|
|
1
|
-
MIT License
|
|
2
|
-
|
|
3
|
-
Copyright (c) 2022 Alexis Bouhet
|
|
4
|
-
|
|
5
|
-
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
6
|
-
of this software and associated documentation files (the "Software"), to deal
|
|
7
|
-
in the Software without restriction, including without limitation the rights
|
|
8
|
-
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
9
|
-
copies of the Software, and to permit persons to whom the Software is
|
|
10
|
-
furnished to do so, subject to the following conditions:
|
|
11
|
-
|
|
12
|
-
The above copyright notice and this permission notice shall be included in all
|
|
13
|
-
copies or substantial portions of the Software.
|
|
14
|
-
|
|
15
|
-
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
16
|
-
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
17
|
-
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
18
|
-
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
19
|
-
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
20
|
-
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
21
|
-
SOFTWARE.
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
# TSP Example
|
|
2
|
-
|
|
3
|
-
## This is a test package for @reflex-stack/tsp, do not use it
|
|
4
|
-
|
|
5
|
-
Main bundle is <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./reports/main-dark.svg"><img src="./reports/main-light.svg"></picture>
|
|
6
|
-
and optional submodule is only <picture style="display: inline-block"><source media="(prefers-color-scheme: dark)" srcset="./reports/submodule-dark.svg"><img src="./reports/submodule-light.svg"></picture>
|
|
7
|
-
|
|
8
|
-
## Install
|
|
9
|
-
|
|
10
|
-
`npm i @reflex-stack/tsp-example`
|
|
11
|
-
|
|
12
|
-
## Usage
|
|
13
|
-
|
|
14
|
-
##### Main module
|
|
15
|
-
- `import { ... } from "{{ packageNPMName }}"`
|
|
16
|
-
|
|
17
|
-
##### Sub module
|
|
18
|
-
- `import { ... } from "{{ packageNPMName }}/submodule"`
|
|
19
|
-
|
|
20
|
-
## Build commands
|
|
21
|
-
|
|
22
|
-
##### Build
|
|
23
|
-
- `npm run build`
|
|
24
|
-
##### Test
|
|
25
|
-
- `npm run test`
|
|
26
|
-
##### Publish
|
|
27
|
-
- `npm run publish`
|
|
28
|
-
|
|
29
|
-
---
|
|
30
|
-
## TSP
|
|
31
|
-
This package has been created with [tsp](https://github.com/reflex-stack/tsp)
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare const commonDep = "common dependency";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export const commonDep = "common dependency";
|