create-nodality 1.0.0-beta.8 → 1.0.0-beta.81

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.
Files changed (5) hide show
  1. package/bin/index.js +79 -48
  2. package/package.json +3 -3
  3. package/readme.md +0 -0
  4. package/templates/index.html +0 -11
  5. package/templates/main.js +0 -5
package/bin/index.js CHANGED
@@ -1,106 +1,134 @@
1
1
  #!/usr/bin/env node
2
2
 
3
3
  import { mkdirSync, writeFileSync, existsSync } from "fs";
4
- import { resolve, dirname } from "path";
4
+ import { resolve/*, dirname*/ } from "path";
5
5
  import { execSync } from "child_process";
6
- import { fileURLToPath } from "url";
6
+ // import { fileURLToPath } from "url";
7
7
 
8
- // Helper to get directory of current file (ESM compatible)
9
- const __filename = fileURLToPath(import.meta.url);
10
- const __dirname = dirname(__filename);
8
+ // path to script itself /Users/fv/create/index.js
9
+ // const __filename = fileURLToPath(import.meta.url);
10
+ // const __dirname = dirname(__filename); // create part (folder name)
11
11
 
12
12
  function createProject(projectName) {
13
+ // process.cwd() = current working directory (where user is running the command from)
14
+ // /Users/fv/create/PROJECT_NAME
13
15
  const projectPath = resolve(process.cwd(), projectName);
14
16
 
17
+ // Check if it exists
15
18
  if (existsSync(projectPath)) {
16
19
  console.error(`Folder ${projectName} already exists.`);
17
20
  process.exit(1);
18
21
  }
19
22
 
23
+ // Make PROJECT_NAME directory
20
24
  mkdirSync(projectPath);
21
25
  const srcPath = resolve(projectPath, "src");
22
26
  mkdirSync(srcPath);
23
27
 
24
- // Create index.html
28
+ // index.html with import map pointing "nodality" to bundled ES module
29
+ // module will be bundled in next steps
25
30
  const indexHtml = `
26
31
  <!DOCTYPE html>
27
32
  <html lang="en">
28
33
  <head>
29
- <meta charset="UTF-8">
30
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
34
+ <meta charset="UTF-8" />
35
+ <meta name="viewport" content="width=device-width, initial-scale=1" />
31
36
  <title>${projectName}</title>
37
+
38
+ <script type="importmap">
39
+ {
40
+ "imports": {
41
+ "nodality": "/dist/lib.bundle.js"
42
+ }
43
+ }
44
+ </script>
32
45
  </head>
33
46
  <body>
34
47
  <div id="mount"></div>
35
- <script src="dist/bundle.js"></script>
48
+
49
+ <script type="module" src="/src/app.js"></script>
36
50
  </body>
37
51
  </html>
38
52
  `;
39
53
  writeFileSync(resolve(projectPath, "index.html"), indexHtml.trim());
40
54
 
41
- // Create index.js
42
- const indexJs = `
43
- import { Text } from 'nodality';
55
+ // app.js stays non-bundled with import from "nodality"
56
+ const appJs = `
57
+
58
+ import * as Nodality from "nodality";
59
+
60
+ const elements = [
61
+ { type: "h1", text: "Hello" }
62
+ ];
63
+
64
+ const nodes = [
65
+ { op: "blast" }
66
+ ];
44
67
 
45
- new Text('Hello, Nodality!')
68
+ new Des()
69
+ .nodes(nodes)
70
+ .add(elements)
46
71
  .set({
47
- size: 'S1',
48
- color: '#1abc9c',
49
- font: 'Arial',
50
- })
51
- .render('#mount');
72
+ mount: "#mount",
73
+ code: true,
74
+ });
52
75
  `;
53
- writeFileSync(resolve(srcPath, "index.js"), indexJs.trim());
76
+ writeFileSync(resolve(srcPath, "app.js"), appJs.trim());
54
77
 
55
- // Create webpack.config.js
78
+ // webpack.config.js outputs nodality as ES module library
56
79
  const webpackConfig = `
57
- import path from 'path';
58
- import { fileURLToPath } from 'url';
80
+ import path from "path";
81
+ import { fileURLToPath } from "url";
59
82
 
60
83
  const __filename = fileURLToPath(import.meta.url);
61
84
  const __dirname = path.dirname(__filename);
62
85
 
63
86
  export default {
64
- mode: 'production',
65
- entry: './src/index.js',
87
+ mode: "production",
88
+ entry: "nodality",
66
89
  output: {
67
- filename: 'bundle.js',
68
- path: path.resolve(__dirname, 'dist'),
90
+ path: path.resolve(__dirname, "dist"), // get dist folder in the current directory
91
+ filename: "lib.bundle.js", // will produce curr_dir/dist/lib.bundle.js using webpack when run
92
+ library: {
93
+ type: "module",
94
+ },
95
+ environment: {
96
+ module: true,
97
+ },
98
+ clean: true,
99
+ },
100
+ experiments: {
101
+ outputModule: true,
69
102
  },
70
103
  module: {
71
104
  rules: [
72
105
  {
73
- test: /\\.js$/,
106
+ test: /\\.m?js$/,
74
107
  exclude: /node_modules/,
75
108
  use: {
76
- loader: 'babel-loader',
109
+ loader: "babel-loader",
77
110
  options: {
78
- presets: ['@babel/preset-env'],
111
+ presets: ["@babel/preset-env"],
79
112
  },
80
113
  },
81
114
  },
82
115
  ],
83
116
  },
84
- resolve: {
85
- alias: {
86
- nodality: path.resolve(__dirname, 'node_modules/nodality/dist/index.esm.js'),
87
- },
88
- },
89
117
  };
90
118
  `;
91
119
  writeFileSync(resolve(projectPath, "webpack.config.js"), webpackConfig.trim());
92
120
 
93
- // Create package.json
121
+ // package.json
94
122
  const pkg = {
95
123
  name: projectName,
96
124
  version: "1.0.0",
97
125
  type: "module",
98
126
  scripts: {
99
- build: "webpack",
127
+ build: "webpack --config webpack.config.js", // calls webpack
100
128
  start: "npx serve . -l 4000",
101
129
  },
102
130
  dependencies: {
103
- nodality: "^1.0.0-beta.4",
131
+ nodality: "^1.0.0-beta.81",
104
132
  },
105
133
  devDependencies: {
106
134
  webpack: "^5.0.0",
@@ -108,31 +136,34 @@ export default {
108
136
  "babel-loader": "^9.0.0",
109
137
  "@babel/core": "^7.0.0",
110
138
  "@babel/preset-env": "^7.0.0",
139
+ serve: "^14.0.0",
111
140
  },
112
141
  };
113
142
  writeFileSync(resolve(projectPath, "package.json"), JSON.stringify(pkg, null, 2));
114
143
 
115
- // Install dependencies
116
144
  console.log("Installing dependencies...");
117
145
  execSync(`npm install`, { cwd: projectPath, stdio: "inherit" });
118
146
 
119
- // Build project
120
- console.log("Building with Webpack...");
121
- execSync(`npx webpack`, { cwd: projectPath, stdio: "inherit" });
147
+ console.log("Building nodality bundle as ES module...");
148
+ execSync(`npm run build`, { cwd: projectPath, stdio: "inherit" });
122
149
 
123
- console.log("\nAll done! Run:\n");
150
+ const bold = "\x1b[1m";
151
+ const color1abc9c = "\x1b[38;5;37m";
152
+ const reset = "\x1b[0m";
153
+
154
+ console.log(`\n${color1abc9c}${bold}%s${reset}\n`, `Project "${projectName}" is ready! 🎉`);
155
+ console.log("\nUsage:\n");
124
156
  console.log(` cd ${projectName}`);
125
- console.log(" npm run build # Rebuild your project");
126
- console.log(" npm start # Serve your project on localhost:4000\n");
157
+ console.log(" npm run build # Rebuild library bundle");
158
+ console.log(" npm start # Serve the project");
127
159
  }
160
+ // copy to create-nodality folder
128
161
 
129
- // Parse CLI arguments
130
- const args = process.argv.slice(2);
131
-
162
+ // get 3rd component from "args" /(<project-name>)
163
+ const args = process.argv.slice(2);
132
164
  if (!args[0]) {
133
165
  console.error("Usage: npm create nodality <project-name>");
134
166
  process.exit(1);
135
167
  }
136
168
 
137
- // Create the project
138
169
  createProject(args[0]);
package/package.json CHANGED
@@ -1,9 +1,9 @@
1
1
  {
2
2
  "name": "create-nodality",
3
- "version": "1.0.0-beta.8",
3
+ "version": "1.0.0-beta.81",
4
4
  "description": "Project scaffolding tool for Nodality library",
5
5
  "bin": {
6
- "create-nodality": "./bin/index.js"
6
+ "create-nodality": "bin/index.js"
7
7
  },
8
8
  "type": "module",
9
9
  "scripts": {
@@ -18,6 +18,6 @@
18
18
  "author": "Filip Vabrousek",
19
19
  "license": "MIT",
20
20
  "dependencies": {
21
- "nodality": "^1.0.0-beta.4"
21
+ "nodality": "^1.0.0-beta.81"
22
22
  }
23
23
  }
package/readme.md DELETED
File without changes
package/templates/index.html DELETED
@@ -1,11 +0,0 @@
1
- <!DOCTYPE html>
2
- <html lang="en">
3
- <head>
4
- <meta charset="UTF-8" />
5
- <title>Nodality App</title>
6
- </head>
7
- <body>
8
- <div id="mount"></div>
9
- <script type="module" src="./main.js"></script>
10
- </body>
11
- </html>
package/templates/main.js DELETED
@@ -1,5 +0,0 @@
1
- import { Text } from "nodality";
2
-
3
- new Text("Hello")
4
- .set({})
5
- .render("#mount");