hans-ui-design-lib 1.0.21 → 1.0.22
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 +90 -9
- package/dist/index.cjs.js +44 -44
- package/dist/index.css +1 -1
- package/dist/index.d.ts +40 -38
- package/dist/index.es.js +2667 -2663
- package/package.json +4 -1
package/README.md
CHANGED
|
@@ -115,9 +115,9 @@ If you're using other Technologies like Angular for example, you don't have to i
|
|
|
115
115
|
...
|
|
116
116
|
<link
|
|
117
117
|
rel="stylesheet"
|
|
118
|
-
href="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib.css"
|
|
118
|
+
href="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib.css?v=1.0.21"
|
|
119
119
|
/>
|
|
120
|
-
<script src="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components.js"></script>
|
|
120
|
+
<script src="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components.js?v=1.0.21"></script>
|
|
121
121
|
</head>
|
|
122
122
|
<body>
|
|
123
123
|
...
|
|
@@ -318,13 +318,94 @@ npm run build:cdn
|
|
|
318
318
|
The build is going to generate the folder 'cdn' on the root of this application.
|
|
319
319
|
Vercel is ready to publish the CDN remote entries with this build command and this folder name.
|
|
320
320
|
Whenever you push your commits on 'main' branch, the Vercel deploy will be called.
|
|
321
|
-
These are the production URL's:
|
|
322
|
-
|
|
323
|
-
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib.css
|
|
324
|
-
|
|
325
|
-
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components.js
|
|
326
|
-
|
|
327
|
-
|
|
321
|
+
These are the production URL's:
|
|
322
|
+
|
|
323
|
+
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib.css
|
|
324
|
+
|
|
325
|
+
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components.js
|
|
326
|
+
|
|
327
|
+
These are the versioned production URL's generated from `package.json` during `npm run build:cdn`:
|
|
328
|
+
|
|
329
|
+
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib.css?v=<package-version>
|
|
330
|
+
|
|
331
|
+
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components.js?v=<package-version>
|
|
332
|
+
|
|
333
|
+
The CDN build also generates immutable versioned file names:
|
|
334
|
+
|
|
335
|
+
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib-<package-version>.css
|
|
336
|
+
|
|
337
|
+
https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components-<package-version>.js
|
|
338
|
+
|
|
339
|
+
The CDN build also generates:
|
|
340
|
+
|
|
341
|
+
https://hans-ui-design-lib-cdn.vercel.app/version.json
|
|
342
|
+
|
|
343
|
+
`version.json` contains the current package version plus the raw, query-versioned and file-versioned asset URLs. Consumers can use it as a deterministic source for cache-busting automation.
|
|
344
|
+
|
|
345
|
+
### CDN cache busting
|
|
346
|
+
|
|
347
|
+
The `?v=` query string is a cache-busting marker for browsers and CDNs. It is not a runtime option consumed by the library itself.
|
|
348
|
+
|
|
349
|
+
For production consumers, prefer the versioned file names when you want immutable asset URLs tied to a specific release. Use the `?v=` pattern when you need a stable path plus explicit cache invalidation.
|
|
350
|
+
|
|
351
|
+
Rules:
|
|
352
|
+
|
|
353
|
+
- use the same version value for both CSS and JS
|
|
354
|
+
- prefer the published `package.json` version
|
|
355
|
+
- update the value whenever a new release should invalidate the consumer cache
|
|
356
|
+
- do not mix assets from different versions in the same page
|
|
357
|
+
- prefer file-versioned URLs for long-lived production integrations
|
|
358
|
+
- prefer `version.json` when a deploy pipeline needs to discover the latest published release automatically
|
|
359
|
+
|
|
360
|
+
Example:
|
|
361
|
+
|
|
362
|
+
```html
|
|
363
|
+
<link
|
|
364
|
+
rel="stylesheet"
|
|
365
|
+
href="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib.css?v=1.0.21"
|
|
366
|
+
/>
|
|
367
|
+
<script src="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components.js?v=1.0.21"></script>
|
|
368
|
+
```
|
|
369
|
+
|
|
370
|
+
Or with immutable versioned files:
|
|
371
|
+
|
|
372
|
+
```html
|
|
373
|
+
<link
|
|
374
|
+
rel="stylesheet"
|
|
375
|
+
href="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-design-lib-1.0.21.css"
|
|
376
|
+
/>
|
|
377
|
+
<script src="https://hans-ui-design-lib-cdn.vercel.app/hans-ui-web-components-1.0.21.js"></script>
|
|
378
|
+
```
|
|
379
|
+
|
|
380
|
+
### Release flow for npm + CDN
|
|
381
|
+
|
|
382
|
+
The recommended release flow is now:
|
|
383
|
+
|
|
384
|
+
```bash
|
|
385
|
+
npm run release:[UPDATE-TYPE]
|
|
386
|
+
```
|
|
387
|
+
|
|
388
|
+
UPDATE-TYPES: patch | minor | major
|
|
389
|
+
|
|
390
|
+
What this does:
|
|
391
|
+
|
|
392
|
+
1. runs lint
|
|
393
|
+
2. runs the full coverage suite
|
|
394
|
+
3. bumps `package.json` version
|
|
395
|
+
4. rebuilds the npm package
|
|
396
|
+
5. rebuilds the CDN output
|
|
397
|
+
6. rebuilds Storybook
|
|
398
|
+
7. publishes the npm package
|
|
399
|
+
|
|
400
|
+
After that:
|
|
401
|
+
|
|
402
|
+
1. commit the updated `package.json` and lockfile
|
|
403
|
+
2. push `main`
|
|
404
|
+
3. Vercel rebuilds the CDN from the new source state
|
|
405
|
+
4. `build:cdn` reads the bumped package version automatically
|
|
406
|
+
5. `version.json` and `cdn/index.html` expose the new versioned URLs
|
|
407
|
+
|
|
408
|
+
To run CDN locally and feed your projects in development, run this command:
|
|
328
409
|
|
|
329
410
|
```bash
|
|
330
411
|
npm run build:cdn-local
|