create-nodality 1.0.95 → 1.0.96
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/bin/index.js +68 -21
- package/package.json +1 -1
package/bin/index.js
CHANGED
|
@@ -13,20 +13,20 @@ function createProject(projectName) {
|
|
|
13
13
|
}
|
|
14
14
|
|
|
15
15
|
mkdirSync(projectPath);
|
|
16
|
-
|
|
17
|
-
mkdirSync(
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
//
|
|
21
|
-
//
|
|
16
|
+
mkdirSync(resolve(projectPath, "src"));
|
|
17
|
+
mkdirSync(resolve(projectPath, "upload"));
|
|
18
|
+
mkdirSync(resolve(projectPath, "upload", "pages"));
|
|
19
|
+
|
|
20
|
+
// Root dev index.html — used during `npm run dev` only as a
|
|
21
|
+
// sketchpad for the Designer (src/app.js). Live-server serves
|
|
22
|
+
// upload/ by default; this root file is opened manually when the
|
|
23
|
+
// user wants the Designer's code-generation panel.
|
|
22
24
|
const indexHtml = `<!DOCTYPE html>
|
|
23
25
|
<html lang="en">
|
|
24
26
|
<head>
|
|
25
27
|
<meta charset="UTF-8">
|
|
26
28
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
27
|
-
<title>${projectName}</title>
|
|
28
|
-
|
|
29
|
-
<!-- importmap to map "nodality" to node_modules path -->
|
|
29
|
+
<title>${projectName} — Designer</title>
|
|
30
30
|
<script type="importmap">
|
|
31
31
|
{
|
|
32
32
|
"imports": {
|
|
@@ -37,15 +37,16 @@ function createProject(projectName) {
|
|
|
37
37
|
</head>
|
|
38
38
|
<body>
|
|
39
39
|
<div id="mount"></div>
|
|
40
|
-
|
|
41
|
-
<!-- User app -->
|
|
42
40
|
<script type="module" src="src/app.js"></script>
|
|
43
41
|
</body>
|
|
44
42
|
</html>`;
|
|
45
43
|
writeFileSync(resolve(projectPath, "index.html"), indexHtml);
|
|
46
44
|
|
|
47
|
-
// src/app.js — the
|
|
48
|
-
//
|
|
45
|
+
// src/app.js — the Designer sketchpad. Declarative quick-start API.
|
|
46
|
+
// Opening this in a browser with `code: true` shows the imperative
|
|
47
|
+
// form on-page; copy pieces into upload/pages/index.js, or run
|
|
48
|
+
// \`npm run compile\` to get them as a companion .designer.js file.
|
|
49
|
+
// This file is NOT part of the SSG build.
|
|
49
50
|
const appJs = `import { Des } from "nodality";
|
|
50
51
|
|
|
51
52
|
const elements = [
|
|
@@ -64,7 +65,48 @@ new Des()
|
|
|
64
65
|
code: true,
|
|
65
66
|
});
|
|
66
67
|
`;
|
|
67
|
-
writeFileSync(resolve(
|
|
68
|
+
writeFileSync(resolve(projectPath, "src", "app.js"), appJs);
|
|
69
|
+
|
|
70
|
+
// upload/index.html — the production shell. Prerender writes the
|
|
71
|
+
// static body into this file in place. Importmap points at the
|
|
72
|
+
// bundled library (./lib.bundle.js, emitted by webpack into upload/).
|
|
73
|
+
const uploadIndexHtml = `<!DOCTYPE html>
|
|
74
|
+
<html lang="en">
|
|
75
|
+
<head>
|
|
76
|
+
<meta charset="UTF-8">
|
|
77
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
78
|
+
<title>${projectName}</title>
|
|
79
|
+
<script type="importmap">
|
|
80
|
+
{
|
|
81
|
+
"imports": {
|
|
82
|
+
"nodality": "./lib.bundle.js"
|
|
83
|
+
}
|
|
84
|
+
}
|
|
85
|
+
</script>
|
|
86
|
+
</head>
|
|
87
|
+
<body>
|
|
88
|
+
<div id="mount"></div>
|
|
89
|
+
<script type="module" src="./pages/index.js"></script>
|
|
90
|
+
</body>
|
|
91
|
+
</html>
|
|
92
|
+
`;
|
|
93
|
+
writeFileSync(resolve(projectPath, "upload", "index.html"), uploadIndexHtml);
|
|
94
|
+
|
|
95
|
+
// upload/pages/index.js — THE canonical source of truth. Imperative
|
|
96
|
+
// class instances directly. This is what \`nodality prerender\` renders,
|
|
97
|
+
// and what the browser re-hydrates with after the static HTML loads.
|
|
98
|
+
// Refine this file by hand; copy any new pieces from the Designer
|
|
99
|
+
// panel (or `npm run compile`) as you sketch in src/app.js.
|
|
100
|
+
const uploadPageJs = `import { Text } from "nodality";
|
|
101
|
+
|
|
102
|
+
new Text("Hello")
|
|
103
|
+
.set({
|
|
104
|
+
size: "S1",
|
|
105
|
+
font: "Arial",
|
|
106
|
+
})
|
|
107
|
+
.render("#mount");
|
|
108
|
+
`;
|
|
109
|
+
writeFileSync(resolve(projectPath, "upload", "pages", "index.js"), uploadPageJs);
|
|
68
110
|
|
|
69
111
|
// webpack outputs the bundle into upload/ so dev (live-server upload)
|
|
70
112
|
// and prerender both see the same lib.bundle.js. clean:false so the
|
|
@@ -107,6 +149,9 @@ export default {
|
|
|
107
149
|
scripts: {
|
|
108
150
|
build: "webpack --config webpack.config.js",
|
|
109
151
|
prerender: "nodality prerender",
|
|
152
|
+
// Run the Designer in jsdom and emit the imperative form as a
|
|
153
|
+
// companion file (upload/pages/index.designer.js). Non-destructive.
|
|
154
|
+
compile: "nodality compile",
|
|
110
155
|
watch: "webpack --watch --config webpack.config.js",
|
|
111
156
|
start: "live-server upload --port=4000 --watch=upload",
|
|
112
157
|
dev: "npm-run-all --parallel watch start"
|
|
@@ -118,6 +163,7 @@ export default {
|
|
|
118
163
|
"@babel/core": "^7.28.4",
|
|
119
164
|
"@babel/preset-env": "^7.28.3",
|
|
120
165
|
"babel-loader": "^9.2.1",
|
|
166
|
+
"jsdom": "^25.0.0",
|
|
121
167
|
"live-server": "^1.2.2",
|
|
122
168
|
"npm-run-all": "^4.1.5",
|
|
123
169
|
"serve": "^14.0.0",
|
|
@@ -151,14 +197,15 @@ export default {
|
|
|
151
197
|
console.log(`\n${color1abc9c}${bold}%s${reset}\n`, `Project "${projectName}" is ready! 🎉`);
|
|
152
198
|
console.log("\nUsage:\n");
|
|
153
199
|
console.log(` cd ${projectName}`);
|
|
154
|
-
console.log(" npm run
|
|
155
|
-
console.log(" npm run
|
|
156
|
-
console.log(" npm run
|
|
157
|
-
console.log(" npm
|
|
200
|
+
console.log(" npm run dev # Live-server on upload/ + webpack watch");
|
|
201
|
+
console.log(" npm run compile # Sketch in src/app.js → emit upload/pages/index.designer.js");
|
|
202
|
+
console.log(" npm run prerender # Render static HTML from upload/pages/*.js");
|
|
203
|
+
console.log(" npm run build # Rebuild lib.bundle.js into upload/");
|
|
158
204
|
console.log("");
|
|
159
|
-
console.log(
|
|
160
|
-
|
|
161
|
-
);
|
|
205
|
+
console.log(` ${color1abc9c}src/app.js${reset} ← Designer sketchpad (declarative)`);
|
|
206
|
+
console.log(` ${color1abc9c}upload/pages/index.js${reset} ← canonical source (imperative). Edit this.`);
|
|
207
|
+
console.log("");
|
|
208
|
+
console.log(` Edit ${color1abc9c}nodality.config.json${reset} to set your public origin before prerender.`);
|
|
162
209
|
}
|
|
163
210
|
|
|
164
211
|
const args = process.argv.slice(2);
|