ember.nvp 1.6.0 → 1.7.1
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/.github/workflows/ci.yml +5 -1
- package/.release-plan.json +51 -9
- package/CHANGELOG.md +30 -0
- package/README.md +41 -28
- package/RELEASE.md +16 -14
- package/package.json +1 -1
- package/packages/build-tooling-utils/README.md +7 -12
- package/packages/build-tooling-utils/package.json +1 -1
- package/packages/build-tooling-utils/src/extensions.ts +4 -3
- package/packages/build-tooling-utils/src/maybe-babel.ts +18 -15
- package/packages/rolldown/README.md +138 -98
- package/packages/rolldown/index.ts +66 -28
- package/packages/rolldown/package.json +1 -1
- package/packages/rolldown/src/app-reexports.test.ts +4 -3
- package/packages/rolldown/src/app-reexports.ts +37 -27
- package/packages/rolldown/src/babel.test.ts +10 -5
- package/packages/rolldown/src/babel.ts +117 -72
- package/packages/rolldown/src/bundle.test.ts +149 -0
- package/packages/rolldown/src/bundle.ts +71 -0
- package/packages/rolldown/src/config.ts +42 -18
- package/packages/rolldown/src/dts.test.ts +42 -26
- package/packages/rolldown/src/externals.test.ts +16 -11
- package/packages/rolldown/src/externals.ts +45 -28
- package/packages/rolldown/src/isolated-declarations.ts +56 -43
- package/packages/rolldown/src/plugin-like.ts +18 -15
- package/packages/rolldown/src/published-types.test.ts +18 -13
- package/packages/rolldown/src/transform.test.ts +26 -17
- package/packages/rolldown/src/transform.ts +68 -48
- package/packages/vite/README.md +10 -11
- package/packages/vite/package.json +1 -1
- package/packages/vite/src/ember.ts +44 -36
- package/packages/vite/src/test-html.ts +13 -11
- package/src/bases/README.md +6 -3
- package/src/bases/minimal-app/app.test.ts +7 -4
- package/src/bases/minimal-app/files/app/app.ts +2 -3
- package/src/bases/minimal-app/files/app/router.ts +3 -3
- package/src/bases/minimal-app/index.js +10 -6
- package/src/bases/minimal-custom-element/files/README.md +95 -0
- package/src/bases/minimal-custom-element/files/package.json +47 -0
- package/src/bases/minimal-custom-element/files/src/components/counter.gts +27 -0
- package/src/bases/minimal-custom-element/files/src/element.ts +45 -0
- package/src/bases/minimal-custom-element/files/src/index.ts +2 -0
- package/src/bases/minimal-custom-element/files/src/register.ts +5 -0
- package/src/bases/minimal-custom-element/files/tsconfig.json +10 -0
- package/src/bases/minimal-custom-element/files/tsdown.config.js +7 -0
- package/src/bases/minimal-custom-element/index.js +212 -0
- package/src/bases/minimal-extension/files/README.md +13 -5
- package/src/bases/minimal-extension/files/app/app.ts +2 -3
- package/src/bases/minimal-extension/files/app/config.ts +5 -3
- package/src/bases/minimal-extension/index.js +16 -11
- package/src/bases/minimal-library/files/README.md +8 -7
- package/src/bases/minimal-library/index.js +21 -15
- package/src/cli/args.js +1 -1
- package/src/cli/generator.js +4 -0
- package/src/cli/index.js +23 -18
- package/src/cli/questions/project-type.js +17 -2
- package/src/cli/questions/write.js +12 -10
- package/src/layers/are-the-types-wrong/index.js +6 -6
- package/src/layers/github-actions/index.js +7 -4
- package/src/layers/inspector-support/index.js +2 -2
- package/src/layers/publint/index.js +2 -2
- package/src/layers/qunit/index.js +21 -17
- package/src/layers/readme/index.js +55 -4
- package/src/layers/renovate/index.js +5 -5
- package/src/layers/typescript/index.js +20 -13
- package/src/layers/vitest/index.js +8 -4
- package/src/utils/babel.js +3 -2
- package/src/utils/buffer.js +2 -2
- package/src/utils/cli.js +4 -4
- package/src/utils/fs.js +23 -14
- package/src/utils/inspector-support.js +22 -19
- package/src/utils/npm.js +15 -12
- package/src/utils/project-type.js +19 -0
- package/src/utils/project.js +14 -2
- package/src/utils/remove-types.js +2 -4
- package/src/utils/rewrite-imports.js +43 -31
- package/src/utils/stage.js +44 -33
- package/src/utils/tsdown-config.js +6 -5
- package/src/utils/types.ts +10 -9
- package/test/ember.nvp/base-custom-element.test.ts +440 -0
- package/test/ember.nvp/base-library.test.ts +6 -4
- package/test/ember.nvp/generator-replace-or-update.test.ts +6 -4
- package/test/ember.nvp/inspector-support.test.ts +4 -3
- package/test/ember.nvp/layer-inspector-support.test.ts +2 -3
- package/test/ember.nvp/layer-publish-checks.test.ts +2 -3
- package/test/ember.nvp/layer-qunit.test.ts +2 -2
- package/test/ember.nvp/layer-readme.test.ts +63 -3
- package/test/ember.nvp/layer-vitest.test.ts +16 -9
- package/test/ember.nvp/layers-load.test.ts +26 -0
- package/test/ember.nvp/library-src-fixtures.ts +7 -3
- package/test/ember.nvp/permutations/custom-element-1.test.ts +3 -0
- package/test/ember.nvp/permutations/custom-element-2.test.ts +3 -0
- package/test/ember.nvp/permutations/custom-element-checks.test.ts +3 -0
- package/test/ember.nvp/permutations/shared.ts +22 -12
- package/test/ember.nvp/publish-configs.test.ts +44 -31
- package/test/ember.nvp/rewrite-imports.test.ts +4 -3
- package/test/ember.nvp/scoped-css-library.test.ts +6 -4
- package/test/test-helpers/permutate.test.ts +3 -3
- package/test/test-helpers.ts +12 -7
|
@@ -7,9 +7,10 @@ import type { Plugin } from "rolldown";
|
|
|
7
7
|
const processor = new Preprocessor();
|
|
8
8
|
|
|
9
9
|
/**
|
|
10
|
-
* `.d.ts` files emitted for `.gts` source reference the original `.gts`
|
|
11
|
-
*
|
|
12
|
-
*
|
|
10
|
+
* `.d.ts` files emitted for `.gts` source reference the original `.gts` specifiers.
|
|
11
|
+
*
|
|
12
|
+
* Consumers can't resolve those,
|
|
13
|
+
* so we rewrite them back to extension-less specifiers.
|
|
13
14
|
*/
|
|
14
15
|
function fixDeclarationImports(content: string): string {
|
|
15
16
|
return content
|
|
@@ -41,10 +42,12 @@ async function fixDtsExtensionsInDir(dir: string): Promise<void> {
|
|
|
41
42
|
/**
|
|
42
43
|
* A sourcemap mapping every generated line to the same line of the input.
|
|
43
44
|
*
|
|
44
|
-
* `AAAA` is the [0, 0, 0, 0] VLQ segment
|
|
45
|
-
*
|
|
46
|
-
*
|
|
47
|
-
*
|
|
45
|
+
* - `AAAA` is the [0, 0, 0, 0] VLQ segment
|
|
46
|
+
* (first line maps to source 0, line 0, column 0)
|
|
47
|
+
* - `AACA` is [0, 0, +1, 0]
|
|
48
|
+
* (each following line advances the source line by one)
|
|
49
|
+
*
|
|
50
|
+
* Exact at line granularity, which is all the specifier rewrite can disturb.
|
|
48
51
|
*/
|
|
49
52
|
function lineIdentityMap(id: string, source: string) {
|
|
50
53
|
return {
|
|
@@ -60,8 +63,10 @@ function lineIdentityMap(id: string, source: string) {
|
|
|
60
63
|
}
|
|
61
64
|
|
|
62
65
|
/**
|
|
63
|
-
*
|
|
64
|
-
* ts
|
|
66
|
+
* Preprocesses `<template>` via content-tag, and maps
|
|
67
|
+
* `.gts` → `.ts`
|
|
68
|
+
* `.gjs` → `.js`
|
|
69
|
+
* so rolldown can identify them as ts / js.
|
|
65
70
|
*/
|
|
66
71
|
export function emberTransform(): Plugin {
|
|
67
72
|
return {
|
|
@@ -70,21 +75,26 @@ export function emberTransform(): Plugin {
|
|
|
70
75
|
resolveId: {
|
|
71
76
|
order: "pre",
|
|
72
77
|
handler(id, importer) {
|
|
73
|
-
// Entries have no importer
|
|
74
|
-
//
|
|
75
|
-
//
|
|
76
|
-
//
|
|
77
|
-
//
|
|
78
|
-
//
|
|
79
|
-
//
|
|
78
|
+
// Entries have no importer.
|
|
79
|
+
// Their ids come straight from the build config
|
|
80
|
+
// (tsdown expands entry globs to on-disk paths).
|
|
81
|
+
//
|
|
82
|
+
// Resolve a `.gts` / `.gjs` entry to the same virtual `.ts` / `.js` id
|
|
83
|
+
// an imported module gets, so the load hook compiles it via content-tag
|
|
84
|
+
// instead of the raw `<template>` source hitting the parser.
|
|
85
|
+
//
|
|
86
|
+
// Entries may be any extension.
|
|
87
|
+
// The emitted `.js` / `.d.ts` paths mirror the entry paths either way
|
|
88
|
+
// (that's how tsdown's dts support works).
|
|
80
89
|
if (!importer) {
|
|
81
90
|
if (!id.endsWith(".gts") && !id.endsWith(".gjs")) return null;
|
|
82
91
|
if (!existsSync(id)) return null;
|
|
83
92
|
|
|
84
|
-
// rolldown's default resolver realpaths entry ids
|
|
85
|
-
// /var -> /private/var).
|
|
86
|
-
//
|
|
87
|
-
//
|
|
93
|
+
// rolldown's default resolver realpaths entry ids
|
|
94
|
+
// (e.g. macOS /var -> /private/var).
|
|
95
|
+
//
|
|
96
|
+
// Match it, or this same file imported from another entry
|
|
97
|
+
// resolves to a second module id and gets duplicated into both chunks.
|
|
88
98
|
const fileName = realpathSync(path.resolve(id));
|
|
89
99
|
|
|
90
100
|
return {
|
|
@@ -93,13 +103,16 @@ export function emberTransform(): Plugin {
|
|
|
93
103
|
};
|
|
94
104
|
}
|
|
95
105
|
|
|
96
|
-
// An absolute specifier already names the file,
|
|
97
|
-
//
|
|
98
|
-
// directory would corrupt it.
|
|
99
|
-
//
|
|
100
|
-
//
|
|
101
|
-
//
|
|
102
|
-
//
|
|
106
|
+
// An absolute specifier already names the file,
|
|
107
|
+
// so it needs no importer-relative resolution.
|
|
108
|
+
// Joining it onto the importer's directory would corrupt it.
|
|
109
|
+
//
|
|
110
|
+
// That is not hypothetical.
|
|
111
|
+
// A plugin's virtual module (id prefixed with `\0`)
|
|
112
|
+
// can generate imports of on-disk files by absolute path,
|
|
113
|
+
// and `path.dirname("\0./registry")` is `"\0."`.
|
|
114
|
+
// Joining then yields `"\0./Users/.../thing.gts"`:
|
|
115
|
+
// a path no `existsSync` / `readFile` can accept (it has a null byte in it).
|
|
103
116
|
const fileName = path.isAbsolute(id) ? id : path.join(path.dirname(importer), id);
|
|
104
117
|
|
|
105
118
|
if (id.endsWith(".gts")) {
|
|
@@ -116,15 +129,19 @@ export function emberTransform(): Plugin {
|
|
|
116
129
|
};
|
|
117
130
|
}
|
|
118
131
|
|
|
119
|
-
// A `.ts
|
|
120
|
-
// resolves to the virtual module.
|
|
121
|
-
//
|
|
122
|
-
//
|
|
123
|
-
//
|
|
124
|
-
//
|
|
125
|
-
//
|
|
126
|
-
//
|
|
127
|
-
//
|
|
132
|
+
// A `.ts` / `.js` specifier whose only backing file is a `.gts` / `.gjs`
|
|
133
|
+
// resolves to the virtual module.
|
|
134
|
+
//
|
|
135
|
+
// This must also serve `.d.ts` importers.
|
|
136
|
+
// rolldown-plugin-dts resolves a declaration module's imports
|
|
137
|
+
// through the plugin pipeline (`this.resolve`).
|
|
138
|
+
// When the resolution is a source file, it loads it (registering its declaration)
|
|
139
|
+
// before mapping the import to the declaration id.
|
|
140
|
+
//
|
|
141
|
+
// Virtual modules exist nowhere else.
|
|
142
|
+
// If we don't answer here, the import either:
|
|
143
|
+
// - fails to resolve (no file on disk)
|
|
144
|
+
// - or, worse, resolves to a declaration id that was never registered
|
|
128
145
|
if (id.endsWith(".ts")) {
|
|
129
146
|
const gtsFileName = fileName.replace(/\.ts$/, ".gts");
|
|
130
147
|
if (existsSync(gtsFileName) && !existsSync(fileName)) {
|
|
@@ -152,9 +169,11 @@ export function emberTransform(): Plugin {
|
|
|
152
169
|
const meta = this.getModuleInfo(id)?.meta ?? {};
|
|
153
170
|
let fileName = meta?.fileName;
|
|
154
171
|
|
|
155
|
-
// A virtual id can be loaded without having passed through our
|
|
156
|
-
//
|
|
157
|
-
//
|
|
172
|
+
// A virtual id can be loaded without having passed through our resolveId
|
|
173
|
+
// (rolldown-plugin-dts calls `this.load({ id })` with just the id),
|
|
174
|
+
// so no meta is attached.
|
|
175
|
+
//
|
|
176
|
+
// Recover the backing file from disk.
|
|
158
177
|
if (!fileName && !existsSync(id)) {
|
|
159
178
|
if (id.endsWith(".ts") && existsSync(id.replace(/\.ts$/, ".gts"))) {
|
|
160
179
|
fileName = id.replace(/\.ts$/, ".gts");
|
|
@@ -188,12 +207,13 @@ export function emberTransform(): Plugin {
|
|
|
188
207
|
id: /\.(js|ts)$/,
|
|
189
208
|
},
|
|
190
209
|
handler(input, id) {
|
|
191
|
-
// Rewrite `.gts` specifiers to `.ts
|
|
192
|
-
// runtime modules AND declaration modules alike.
|
|
193
|
-
//
|
|
194
|
-
//
|
|
195
|
-
//
|
|
196
|
-
//
|
|
210
|
+
// Rewrite `.gts` specifiers to `.ts`, the (virtual) source id,
|
|
211
|
+
// in runtime modules AND declaration modules alike.
|
|
212
|
+
//
|
|
213
|
+
// Declaration modules must NOT be rewritten to `.d.ts`.
|
|
214
|
+
// rolldown-plugin-dts's resolver treats a source-file resolution as
|
|
215
|
+
// "load it (registering its declaration), then map to the declaration id".
|
|
216
|
+
// A `.d.ts` id is returned as-is: unloadable when the module isn't registered yet
|
|
197
217
|
// (e.g. the `.gts` is only ever type-imported).
|
|
198
218
|
const output = input.replace(
|
|
199
219
|
/(['"`])((?:\.\.?\/|\/|@|[A-Za-z0-9_\-])[^'"]*?\.gts)\1/g,
|
|
@@ -204,9 +224,9 @@ export function emberTransform(): Plugin {
|
|
|
204
224
|
return null;
|
|
205
225
|
}
|
|
206
226
|
|
|
207
|
-
// The rewrite only shortens import specifiers in place,
|
|
208
|
-
// line-identity map is accurate to the line
|
|
209
|
-
// everything before the first rewritten specifier on a line).
|
|
227
|
+
// The rewrite only shortens import specifiers in place,
|
|
228
|
+
// so a line-identity map is accurate to the line
|
|
229
|
+
// (and to the column, for everything before the first rewritten specifier on a line).
|
|
210
230
|
return { code: output, map: lineIdentityMap(id, input) };
|
|
211
231
|
},
|
|
212
232
|
},
|
package/packages/vite/README.md
CHANGED
|
@@ -8,30 +8,29 @@ A speed-optimized default meta-config for ember projects.
|
|
|
8
8
|
npm add @nullvoxpopuli/ember-vite
|
|
9
9
|
```
|
|
10
10
|
|
|
11
|
-
Requires node 24
|
|
12
|
-
|
|
13
|
-
`esnext`).
|
|
11
|
+
Requires node 24+. These packages ship TypeScript source, so type-checking
|
|
12
|
+
needs TypeScript 6+ with `lib` covering `es2025` (for example `esnext`).
|
|
14
13
|
|
|
15
14
|
## Usage
|
|
16
15
|
|
|
17
|
-
|
|
16
|
+
In your vite config:
|
|
18
17
|
|
|
19
18
|
```js
|
|
20
19
|
import { defineConfig } from "vite";
|
|
21
20
|
import { ember } from "@nullvoxpopuli/ember-vite";
|
|
22
21
|
|
|
23
22
|
export default defineConfig({
|
|
24
|
-
plugins: [
|
|
25
|
-
|
|
26
|
-
],
|
|
27
|
-
}
|
|
23
|
+
plugins: [ember()],
|
|
24
|
+
});
|
|
28
25
|
```
|
|
29
26
|
|
|
30
|
-
|
|
31
|
-
|
|
27
|
+
Then:
|
|
28
|
+
|
|
29
|
+
1. Remove any plugins from embroider or babel.
|
|
30
|
+
2. Delete from your package.json: `@rollup/plugin-babel`, `@embroider/core`, `@embroider/vite`.
|
|
32
31
|
|
|
33
32
|
> [!NOTE]
|
|
34
|
-
>
|
|
33
|
+
> Linting still needs the babel related deps, so keep those.
|
|
35
34
|
|
|
36
35
|
## Requirements
|
|
37
36
|
|
|
@@ -19,14 +19,16 @@ function absolutePath(relativePath: string) {
|
|
|
19
19
|
* Everything a project without its own babel config needs:
|
|
20
20
|
*
|
|
21
21
|
* - TypeScript stripping
|
|
22
|
-
* - template compilation
|
|
23
|
-
* project's own ember-source,
|
|
22
|
+
* - template compilation, to the wire format
|
|
23
|
+
* (vite serves and bundles for the project's own ember-source,
|
|
24
|
+
* so the final compile happens here)
|
|
24
25
|
* - build macros, evaluated at build time
|
|
25
|
-
* - decorator-transforms, with its runtime left as a bare specifier
|
|
26
|
-
* resolves from the project
|
|
26
|
+
* - decorator-transforms, with its runtime left as a bare specifier
|
|
27
|
+
* so it resolves from the project
|
|
28
|
+
* (the project depends on `decorator-transforms`)
|
|
27
29
|
*
|
|
28
|
-
* The plugins are named, not imported
|
|
29
|
-
* project, which carries them as its own dependencies.
|
|
30
|
+
* The plugins are named, not imported.
|
|
31
|
+
* babel resolves them from the project, which carries them as its own dependencies.
|
|
30
32
|
*/
|
|
31
33
|
function defaultBabelPlugins() {
|
|
32
34
|
const macros = buildMacros();
|
|
@@ -56,12 +58,14 @@ type BabelOptions =
|
|
|
56
58
|
};
|
|
57
59
|
|
|
58
60
|
/**
|
|
59
|
-
* The project's babel config wins when it exists
|
|
60
|
-
* selects which one (e.g. a test-only `config/test/babel.config.js`).
|
|
61
|
-
*
|
|
62
|
-
* templates, macros, and decorators,
|
|
63
|
-
*
|
|
64
|
-
*
|
|
61
|
+
* The project's babel config wins when it exists.
|
|
62
|
+
* `babel.configFile` selects which one (e.g. a test-only `config/test/babel.config.js`).
|
|
63
|
+
*
|
|
64
|
+
* Without one (libraries), `defaultBabelPlugins` covers TypeScript, templates, macros, and decorators,
|
|
65
|
+
* so no config file is required.
|
|
66
|
+
*
|
|
67
|
+
* Helpers are inlined in that case:
|
|
68
|
+
* projects without a babel config don't carry `@babel/runtime`.
|
|
65
69
|
*/
|
|
66
70
|
function babelOptions(nvpConfig: Config): BabelOptions {
|
|
67
71
|
const configFile = resolve(
|
|
@@ -83,9 +87,12 @@ function babelOptions(nvpConfig: Config): BabelOptions {
|
|
|
83
87
|
/**
|
|
84
88
|
* Additional opt-ins beyond maybeBabel's built-in list.
|
|
85
89
|
*
|
|
86
|
-
* These libraries ship code that still needs babel
|
|
87
|
-
*
|
|
88
|
-
*
|
|
90
|
+
* These libraries ship code that still needs babel:
|
|
91
|
+
* - ember-concurrency's decorators
|
|
92
|
+
* - ember-scoped-css transforms
|
|
93
|
+
* - ember-intl's formatMessage macro
|
|
94
|
+
*
|
|
95
|
+
* The `initializeRuntimeMacrosConfig` runtime call must also be compiled away.
|
|
89
96
|
*/
|
|
90
97
|
function babelFilter(nvpConfig: Config) {
|
|
91
98
|
return {
|
|
@@ -120,9 +127,10 @@ interface Config {
|
|
|
120
127
|
configFile?: string;
|
|
121
128
|
|
|
122
129
|
/**
|
|
123
|
-
* optional way to configure when babel is
|
|
124
|
-
*
|
|
125
|
-
*
|
|
130
|
+
* optional way to configure when babel is activated.
|
|
131
|
+
*
|
|
132
|
+
* by default, all transforming is oxc,
|
|
133
|
+
* except when babel is needed (for things not currently implemented in oxc)
|
|
126
134
|
*/
|
|
127
135
|
include?: {
|
|
128
136
|
/**
|
|
@@ -154,10 +162,12 @@ export function ember(nvpConfig: Config = {}) {
|
|
|
154
162
|
const filter = babelFilter(nvpConfig);
|
|
155
163
|
|
|
156
164
|
/*
|
|
157
|
-
* Plugins must be returned as top-level array entries
|
|
158
|
-
* config.plugins inside a config() hook.
|
|
159
|
-
*
|
|
160
|
-
*
|
|
165
|
+
* Plugins must be returned as top-level array entries,
|
|
166
|
+
* NOT pushed into config.plugins inside a config() hook.
|
|
167
|
+
*
|
|
168
|
+
* Vite 8 extracts user plugins *before* config hooks run,
|
|
169
|
+
* so anything added later is invisible to the plugin container
|
|
170
|
+
* (resolveId, load, etc. hooks never fire).
|
|
161
171
|
*/
|
|
162
172
|
return [
|
|
163
173
|
{
|
|
@@ -194,9 +204,8 @@ export function ember(nvpConfig: Config = {}) {
|
|
|
194
204
|
resolver({ rolldown: true }),
|
|
195
205
|
templateTag(),
|
|
196
206
|
|
|
197
|
-
// Libraries
|
|
198
|
-
//
|
|
199
|
-
// template compiler
|
|
207
|
+
// Libraries ship precompileTemplate calls and macros.
|
|
208
|
+
// Both must compile away here, with this app's template compiler.
|
|
200
209
|
maybeBabel({
|
|
201
210
|
...babel,
|
|
202
211
|
parallel: nvpConfig.babel?.parallel,
|
|
@@ -231,14 +240,12 @@ function applyConfig(viteConfig: ResolvedConfig, env: ConfigEnv, nvpConfig: Conf
|
|
|
231
240
|
}
|
|
232
241
|
|
|
233
242
|
function dev(viteConfig: ResolvedConfig, nvpConfig: Config) {
|
|
234
|
-
|
|
235
|
-
*
|
|
243
|
+
/**
|
|
236
244
|
* build config for tests
|
|
237
245
|
*
|
|
238
|
-
* NOTE: we can't minify
|
|
239
|
-
*
|
|
240
|
-
|
|
241
|
-
*************************************/
|
|
246
|
+
* NOTE: we can't minify.
|
|
247
|
+
* some tests check x.constructor.name, which changes when minified
|
|
248
|
+
*/
|
|
242
249
|
Object.assign(viteConfig.build, {
|
|
243
250
|
sourcemap: true,
|
|
244
251
|
cleanCssOptions: { sourceMap: true },
|
|
@@ -333,7 +340,8 @@ function prod(viteConfig: ResolvedConfig, nvpConfig: Config) {
|
|
|
333
340
|
minify: true,
|
|
334
341
|
cleanDir: true,
|
|
335
342
|
/**
|
|
336
|
-
*
|
|
343
|
+
* Needed due to how we manage module state.
|
|
344
|
+
*
|
|
337
345
|
* This can create waterfalls when too much top-level await is used.
|
|
338
346
|
*/
|
|
339
347
|
strictExecutionOrder: true,
|
|
@@ -342,10 +350,10 @@ function prod(viteConfig: ResolvedConfig, nvpConfig: Config) {
|
|
|
342
350
|
*/
|
|
343
351
|
codeSplitting: {
|
|
344
352
|
/**
|
|
345
|
-
* Kind of a shame this isn't automatic based on dynamic import usage
|
|
346
|
-
*
|
|
347
|
-
*
|
|
348
|
-
* rather than rely on automatic optimizations based on import/module usage
|
|
353
|
+
* Kind of a shame this isn't automatic based on dynamic import usage in vite8.
|
|
354
|
+
*
|
|
355
|
+
* This forces us to know every potential problem area of the app,
|
|
356
|
+
* rather than rely on automatic optimizations based on import/module usage.
|
|
349
357
|
*/
|
|
350
358
|
groups: [...(nvpConfig?.production?.codeSplittingGroups ?? [])],
|
|
351
359
|
},
|
|
@@ -3,10 +3,10 @@ import { join } from "node:path";
|
|
|
3
3
|
import type { ViteDevServer } from "vite";
|
|
4
4
|
|
|
5
5
|
/**
|
|
6
|
-
* Everything a QUnit + testem run needs, with no project-specific
|
|
7
|
-
*
|
|
8
|
-
*
|
|
9
|
-
* co-located `*-test` modules under src
|
|
6
|
+
* Everything a QUnit + testem run needs, with no project-specific references.
|
|
7
|
+
*
|
|
8
|
+
* - root-relative specifiers keep it independent of where the project keeps its files
|
|
9
|
+
* - the globs pick up tests/** as well as co-located `*-test` modules under src/**
|
|
10
10
|
*/
|
|
11
11
|
const DEFAULT_TEST_HTML = `<!doctype html>
|
|
12
12
|
<html>
|
|
@@ -39,14 +39,16 @@ const DEFAULT_TEST_HTML = `<!doctype html>
|
|
|
39
39
|
`;
|
|
40
40
|
|
|
41
41
|
/**
|
|
42
|
-
* Lets a project run its tests without maintaining a tests/index.html
|
|
43
|
-
*
|
|
44
|
-
*
|
|
45
|
-
*
|
|
46
|
-
* `
|
|
47
|
-
*
|
|
42
|
+
* Lets a project run its tests without maintaining a tests/index.html.
|
|
43
|
+
*
|
|
44
|
+
* Whenever that file is absent, this plugin answers for it:
|
|
45
|
+
* - `load` supplies the html to the build
|
|
46
|
+
* (so `tests/index.html` still lands in dist for testem)
|
|
47
|
+
* - the dev-server middleware serves it, through `transformIndexHtml`,
|
|
48
|
+
* so the html goes through the same pipeline as an on-disk file
|
|
48
49
|
*
|
|
49
|
-
* A tests/index.html on disk always wins
|
|
50
|
+
* A tests/index.html on disk always wins.
|
|
51
|
+
* Every hook here defers to it.
|
|
50
52
|
*/
|
|
51
53
|
export function testHtml() {
|
|
52
54
|
const htmlPath = join(process.cwd(), "tests", "index.html");
|
package/src/bases/README.md
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
Each
|
|
1
|
+
Each base is a _real_ project.
|
|
2
|
+
You can run it from its `files/` directory.
|
|
2
3
|
|
|
3
|
-
|
|
4
|
+
A base never uses a template language such as ejs:
|
|
5
|
+
that would make the base unrunnable.
|
|
4
6
|
|
|
5
|
-
|
|
7
|
+
To change the project name, the base's `index.js` finds every place the name is used,
|
|
8
|
+
and swaps it out (codemod style).
|
|
@@ -110,8 +110,9 @@ const DEBUG_MARKERS = {
|
|
|
110
110
|
|
|
111
111
|
/**
|
|
112
112
|
* Lives in app/services/ so that app.ts's eager
|
|
113
|
-
* `import.meta.glob("./services/**\/*")` pulls it into the build
|
|
114
|
-
*
|
|
113
|
+
* `import.meta.glob("./services/**\/*")` pulls it into the build.
|
|
114
|
+
*
|
|
115
|
+
* No generated file needs to change.
|
|
115
116
|
*/
|
|
116
117
|
const debugFixture = `
|
|
117
118
|
import { assert, deprecate, warn } from "@ember/debug";
|
|
@@ -134,8 +135,10 @@ if (macroCondition(isDevelopingApp())) {
|
|
|
134
135
|
`;
|
|
135
136
|
|
|
136
137
|
/**
|
|
137
|
-
* Only .js files
|
|
138
|
-
*
|
|
138
|
+
* Only .js files.
|
|
139
|
+
*
|
|
140
|
+
* The sourcemaps (.map) contain the original source (with markers),
|
|
141
|
+
* even in production builds.
|
|
139
142
|
*/
|
|
140
143
|
async function builtJavaScript(project: Project): Promise<string> {
|
|
141
144
|
let files = globSync("dist/**/*.js", { cwd: project.directory });
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Looking for services that come from addons?
|
|
3
3
|
*
|
|
4
|
+
* App-tree merging from libraries is not supported.
|
|
4
5
|
* See: https://github.com/embroider-build/embroider/issues/2659
|
|
5
6
|
*
|
|
6
|
-
*
|
|
7
|
-
*
|
|
8
|
-
* For services, I highly recommend looking in to either of
|
|
7
|
+
* For services, look in to either of:
|
|
9
8
|
* - https://github.com/chancancode/ember-polaris-service-
|
|
10
9
|
* - https://ember-primitives.pages.dev/6-utils/createService.md
|
|
11
10
|
* - https://ember-primitives.pages.dev/6-utils/createAsyncService.md
|
|
@@ -10,10 +10,10 @@ export default class Router extends EmbroiderRouter {
|
|
|
10
10
|
Router.map(function () {});
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
|
+
* Route bundles (lazy-loaded route groups) have no nice API yet.
|
|
14
|
+
*
|
|
13
15
|
* Caveat:
|
|
14
16
|
* - https://github.com/embroider-build/embroider/issues/2521
|
|
15
|
-
* We don't yet have a way to do this in a nice way
|
|
16
|
-
*
|
|
17
17
|
*/
|
|
18
18
|
// function bundle(name: string, loader: () => Promise<{ default: unknown }>[]) {
|
|
19
19
|
// return {
|
|
@@ -35,7 +35,7 @@ Router.map(function () {});
|
|
|
35
35
|
// }
|
|
36
36
|
|
|
37
37
|
/**
|
|
38
|
-
*
|
|
38
|
+
* Example usage, from:
|
|
39
39
|
* - https://github.com/NullVoxPopuli/limber/blob/67e2f54bbe224052e38f9a9e566d704411e65e86/apps/repl/app/router.ts#L35
|
|
40
40
|
*/
|
|
41
41
|
// (window as any)._embroiderRouteBundles_ = [
|
|
@@ -5,7 +5,7 @@ import { applyFolderTo } from "#utils/fs.js";
|
|
|
5
5
|
import { removeConfiguredPlugin } from "#utils/babel.js";
|
|
6
6
|
|
|
7
7
|
/**
|
|
8
|
-
* Minimal
|
|
8
|
+
* Minimal App Base
|
|
9
9
|
*
|
|
10
10
|
* Provides the absolute bare minimum for an Ember app:
|
|
11
11
|
* - type: "module" in package.json
|
|
@@ -22,8 +22,10 @@ export default {
|
|
|
22
22
|
/**
|
|
23
23
|
* 1. Apply files
|
|
24
24
|
* a. Remove TS if needed
|
|
25
|
-
* 2.
|
|
26
|
-
* 3.
|
|
25
|
+
* 2. Update name(s)
|
|
26
|
+
* 3. Remove TS deps/files if needed
|
|
27
|
+
* 4. Upgrade in-range dependencies
|
|
28
|
+
* 5. Update an existing babel config, if any
|
|
27
29
|
*
|
|
28
30
|
* @param {import('#utils/project.js').Project} project
|
|
29
31
|
*/
|
|
@@ -37,6 +39,8 @@ export default {
|
|
|
37
39
|
};
|
|
38
40
|
|
|
39
41
|
/**
|
|
42
|
+
* A JavaScript project's babel config must not reference the TS plugin.
|
|
43
|
+
*
|
|
40
44
|
* @param {import('#utils/project.js').Project} project
|
|
41
45
|
*/
|
|
42
46
|
async function updateBabelConfig(project) {
|
|
@@ -72,10 +76,10 @@ async function makeJavaScript(project) {
|
|
|
72
76
|
if (await project.hasOrWantsLayer("typescript")) return;
|
|
73
77
|
|
|
74
78
|
/**
|
|
75
|
-
*
|
|
79
|
+
* Intellisense for JS needs some of these,
|
|
80
|
+
* but minimal means minimal.
|
|
76
81
|
*
|
|
77
|
-
*
|
|
78
|
-
* And we add a layer later for JSDoc ased TS or something
|
|
82
|
+
* A later layer for JSDoc-based TS can add them back.
|
|
79
83
|
*/
|
|
80
84
|
await packageJson.removeDevDependencies(
|
|
81
85
|
[
|
|
@@ -0,0 +1,95 @@
|
|
|
1
|
+
# minimal-custom-element
|
|
2
|
+
|
|
3
|
+
An Ember component, packaged as a
|
|
4
|
+
[custom element](https://developer.mozilla.org/en-US/docs/Web/API/Web_components/Using_custom_elements)
|
|
5
|
+
and built with
|
|
6
|
+
[`@nullvoxpopuli/ember-rolldown`](https://github.com/NullVoxPopuli/ember.nvp/tree/main/packages/rolldown)
|
|
7
|
+
and [tsdown](https://tsdown.dev/).
|
|
8
|
+
|
|
9
|
+
`dist/` contains ember and every other dependency. The page that uses the element
|
|
10
|
+
needs nothing else.
|
|
11
|
+
|
|
12
|
+
## Usage
|
|
13
|
+
|
|
14
|
+
Import the `register` entry once. It defines the `<minimal-custom-element>` tag.
|
|
15
|
+
|
|
16
|
+
```js
|
|
17
|
+
import "minimal-custom-element/register";
|
|
18
|
+
```
|
|
19
|
+
|
|
20
|
+
```html
|
|
21
|
+
<minimal-custom-element label="Clicks" step="2"></minimal-custom-element>
|
|
22
|
+
```
|
|
23
|
+
|
|
24
|
+
To choose your own tag name, import the class and define it yourself:
|
|
25
|
+
|
|
26
|
+
```js
|
|
27
|
+
import { CounterElement } from "minimal-custom-element";
|
|
28
|
+
|
|
29
|
+
customElements.define("my-counter", CounterElement);
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
Ember apps can import the `Counter` component directly from the package root.
|
|
33
|
+
|
|
34
|
+
## Development
|
|
35
|
+
|
|
36
|
+
```bash
|
|
37
|
+
pnpm install
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
Build the distributable (JS + `.d.ts` into `dist/`):
|
|
41
|
+
|
|
42
|
+
```bash
|
|
43
|
+
pnpm build
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
Rebuild on change while developing:
|
|
47
|
+
|
|
48
|
+
```bash
|
|
49
|
+
pnpm start
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
## Structure
|
|
53
|
+
|
|
54
|
+
- `src/components/counter.gts` is the Ember component.
|
|
55
|
+
- `src/element.ts` is the custom element.
|
|
56
|
+
Its `connectedCallback` renders the component with `renderComponent` from `@ember/renderer`.
|
|
57
|
+
Its `disconnectedCallback` destroys that render.
|
|
58
|
+
- `src/register.ts` defines the tag.
|
|
59
|
+
Consumers import this file for its side effect.
|
|
60
|
+
- `src/index.ts` is the public entry point.
|
|
61
|
+
It exports the element class and the component.
|
|
62
|
+
- `dist/` is the built output that gets published (git-ignored).
|
|
63
|
+
|
|
64
|
+
### Reactive attributes
|
|
65
|
+
|
|
66
|
+
The element lists its attributes in `observedAttributes`.
|
|
67
|
+
Each attribute change writes to a tracked object.
|
|
68
|
+
The component reads its args from that object, so the DOM updates on the next render.
|
|
69
|
+
|
|
70
|
+
To add an attribute:
|
|
71
|
+
|
|
72
|
+
1. Add its name to `observedAttributes`.
|
|
73
|
+
2. Give it a default value in the tracked object.
|
|
74
|
+
3. Write the new value in `attributeChangedCallback`.
|
|
75
|
+
4. Read it as an arg in the component.
|
|
76
|
+
|
|
77
|
+
Declarations are emitted with
|
|
78
|
+
[isolated declarations](https://www.typescriptlang.org/tsconfig/#isolatedDeclarations),
|
|
79
|
+
so every exported value needs an explicit type annotation.
|
|
80
|
+
|
|
81
|
+
### Development or production ember
|
|
82
|
+
|
|
83
|
+
The build bundles the production build of ember.
|
|
84
|
+
|
|
85
|
+
To bundle the development build (assertions and deprecation messages),
|
|
86
|
+
add the `development` condition in `tsdown.config.js`:
|
|
87
|
+
|
|
88
|
+
```js
|
|
89
|
+
inputOptions: { resolve: { conditionNames: ["development"] } },
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
## Publishing
|
|
93
|
+
|
|
94
|
+
`dist/` is built automatically on `prepack`, so `npm publish` ships the
|
|
95
|
+
compiled output plus your `src/`.
|