chocola 1.2.1 → 1.2.3
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/compiler/index.js +82 -81
- package/package.json +1 -1
package/compiler/index.js
CHANGED
|
@@ -7,13 +7,13 @@ import { loadConfig, resolvePaths } from "./config.js";
|
|
|
7
7
|
|
|
8
8
|
// DOM Processing
|
|
9
9
|
import {
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
10
|
+
createDOM,
|
|
11
|
+
validateAppContainer,
|
|
12
|
+
getAppElements,
|
|
13
|
+
getAssetLinks,
|
|
14
|
+
appendRuntimeScript,
|
|
15
|
+
serializeDOM,
|
|
16
|
+
writeHTMLOutput,
|
|
17
17
|
} from "./dom-processor.js";
|
|
18
18
|
|
|
19
19
|
// Component & Runtime Processing
|
|
@@ -23,11 +23,11 @@ import { generateRuntimeScript } from "./runtime-generator.js";
|
|
|
23
23
|
// Utilities & Pipeline
|
|
24
24
|
import { throwError } from "./utils.js";
|
|
25
25
|
import {
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
26
|
+
copyResources,
|
|
27
|
+
getComponents,
|
|
28
|
+
getSrcIndex,
|
|
29
|
+
processIcons,
|
|
30
|
+
processStylesheet,
|
|
31
31
|
} from "./pipeline.js";
|
|
32
32
|
|
|
33
33
|
|
|
@@ -39,10 +39,10 @@ ________________________________________________________________________
|
|
|
39
39
|
`);
|
|
40
40
|
|
|
41
41
|
function logBanner() {
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
42
|
+
console.log(chalk.bold.hex("#945e33")(`\n RUNNING CHOCOLA BUNDLER`));
|
|
43
|
+
console.log(logSeparation);
|
|
44
|
+
console.log(
|
|
45
|
+
chalk.hex("#945e33")(`
|
|
46
46
|
|
|
47
47
|
|
|
48
48
|
▄████▄ ██░ ██ ▒█████ ▄████▄ ▒█████ ██▓ ▄▄▄
|
|
@@ -58,63 +58,63 @@ function logBanner() {
|
|
|
58
58
|
|
|
59
59
|
|
|
60
60
|
`)
|
|
61
|
-
|
|
61
|
+
);
|
|
62
62
|
}
|
|
63
63
|
|
|
64
64
|
function logSuccess(outDirPath) {
|
|
65
|
-
|
|
65
|
+
console.log(`
|
|
66
66
|
▄▄ ▄▄▄ ▄▄▄▄ ▄▄▄▄ ▄▄▄ ▄▄ ▄▄ ▄▄▄▄▄ ██
|
|
67
67
|
██ ██▀██ ██▄██ ██▀██ ██▀██ ███▄██ ██▄▄ ██
|
|
68
68
|
▄▄█▀ ▀███▀ ██▄█▀ ████▀ ▀███▀ ██ ▀██ ██▄▄▄ ▄▄
|
|
69
69
|
|
|
70
70
|
`);
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
71
|
+
console.log(
|
|
72
|
+
chalk.bold.green(">"),
|
|
73
|
+
"Project bundled succesfully at",
|
|
74
|
+
chalk.green.underline(outDirPath) + "\n\n"
|
|
75
|
+
);
|
|
76
76
|
}
|
|
77
77
|
|
|
78
78
|
// ===== Directory Setup =====
|
|
79
79
|
|
|
80
80
|
async function setupOutputDirectory(outDirPath, emptyOutDir) {
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
81
|
+
if (emptyOutDir) {
|
|
82
|
+
await fs.rm(outDirPath, { recursive: true, force: true });
|
|
83
|
+
await fs.mkdir(outDirPath);
|
|
84
|
+
}
|
|
85
85
|
}
|
|
86
86
|
|
|
87
87
|
// ===== Component Loading =====
|
|
88
88
|
|
|
89
89
|
async function loadAndDisplayComponents(srcComponentsPath) {
|
|
90
|
-
|
|
91
|
-
|
|
90
|
+
const foundComponents = await getComponents(srcComponentsPath);
|
|
91
|
+
const { loadedComponents, notDefComps, componentsLib } = foundComponents;
|
|
92
92
|
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
93
|
+
console.log(` LOADING COMPONENTS`);
|
|
94
|
+
console.log(chalk.bold.green(">"), "Components found in", chalk.green.underline(srcComponentsPath) + ":");
|
|
95
|
+
console.log(" ", componentsLib, "\n");
|
|
96
96
|
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
97
|
+
if (notDefComps.length > 0) {
|
|
98
|
+
console.warn(chalk.bold.yellow("WARNING!"), "The following components don't include a default export:");
|
|
99
|
+
console.log(" ", notDefComps);
|
|
100
|
+
}
|
|
101
101
|
|
|
102
|
-
|
|
102
|
+
return loadedComponents;
|
|
103
103
|
}
|
|
104
104
|
|
|
105
105
|
// ===== Asset Processing =====
|
|
106
106
|
|
|
107
107
|
async function processAssets(doc, rootDir, srcDir, outDirPath) {
|
|
108
|
-
|
|
109
|
-
|
|
108
|
+
const { stylesheets, icons } = getAssetLinks(doc);
|
|
109
|
+
const fileIds = [];
|
|
110
110
|
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
111
|
+
for (const link of stylesheets) {
|
|
112
|
+
await processStylesheet(link, rootDir, srcDir, outDirPath, fileIds);
|
|
113
|
+
}
|
|
114
114
|
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
115
|
+
for (const link of icons) {
|
|
116
|
+
await processIcons(link, rootDir, srcDir, outDirPath, fileIds);
|
|
117
|
+
}
|
|
118
118
|
}
|
|
119
119
|
|
|
120
120
|
// ===== Main Compilation Function =====
|
|
@@ -128,52 +128,53 @@ async function processAssets(doc, rootDir, srcDir, outDirPath) {
|
|
|
128
128
|
* >} config
|
|
129
129
|
*/
|
|
130
130
|
export default async function runtime(rootDir, buildConfig) {
|
|
131
|
-
|
|
131
|
+
const isHotReload = buildConfig.isHotReload || null;
|
|
132
|
+
!isHotReload && logBanner();
|
|
132
133
|
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
134
|
+
// Load Configuration
|
|
135
|
+
const config = await loadConfig(rootDir);
|
|
136
|
+
const paths = resolvePaths(rootDir, config);
|
|
137
|
+
!isHotReload && console.log(logSeparation);
|
|
137
138
|
|
|
138
|
-
|
|
139
|
-
|
|
139
|
+
// Setup Output Directory
|
|
140
|
+
await setupOutputDirectory(paths.outDir, config.emptyOutDir);
|
|
140
141
|
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
142
|
+
// Load Index File
|
|
143
|
+
const indexFiles = await getSrcIndex(paths.src);
|
|
144
|
+
const srcIndexContent = indexFiles.srcHtmlFile || indexFiles.srcChocoFile;
|
|
144
145
|
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
146
|
+
// Load Components
|
|
147
|
+
const loadedComponents = await loadAndDisplayComponents(paths.components);
|
|
148
|
+
!isHotReload && console.log(logSeparation);
|
|
148
149
|
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
150
|
+
// Create and Validate DOM
|
|
151
|
+
!isHotReload && console.log(` BUNDLING STATIC BUILD`);
|
|
152
|
+
!isHotReload && console.log(chalk.bold.green(">"), "Creating Chocola static build in directory", chalk.green.underline(paths.outDir) + "\n");
|
|
153
|
+
!isHotReload && console.log(logSeparation);
|
|
153
154
|
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
155
|
+
const dom = createDOM(srcIndexContent);
|
|
156
|
+
const doc = dom.window.document;
|
|
157
|
+
const appContainer = validateAppContainer(doc);
|
|
158
|
+
const appElements = getAppElements(appContainer);
|
|
158
159
|
|
|
159
|
-
|
|
160
|
-
|
|
160
|
+
// Process Components
|
|
161
|
+
const { runtimeScript } = processAllComponents(appElements, loadedComponents);
|
|
161
162
|
|
|
162
|
-
|
|
163
|
-
|
|
163
|
+
// Generate Runtime File
|
|
164
|
+
const runtimeFilename = await generateRuntimeScript(runtimeScript, paths.outDir);
|
|
164
165
|
|
|
165
|
-
|
|
166
|
-
|
|
166
|
+
// Process Assets (stylesheets, icons)
|
|
167
|
+
await processAssets(doc, rootDir, config.srcDir, paths.outDir);
|
|
167
168
|
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
169
|
+
// Finalize HTML
|
|
170
|
+
appendRuntimeScript(doc, runtimeFilename);
|
|
171
|
+
const html = await serializeDOM(dom);
|
|
172
|
+
await writeHTMLOutput(html, paths.outDir);
|
|
172
173
|
|
|
173
|
-
|
|
174
|
-
|
|
174
|
+
// Copy Resources
|
|
175
|
+
await copyResources(rootDir, config.srcDir, paths.outDir);
|
|
175
176
|
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
177
|
+
// Success Message
|
|
178
|
+
!isHotReload && logSuccess(paths.outDir);
|
|
179
|
+
isHotReload && console.log("Dev server updated");
|
|
179
180
|
}
|