vanilla-jet 1.3.0-beta → 1.3.0
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/.grunt/compile_html.js +1 -0
- package/framework/server.js +0 -1
- package/gulpfile.js +29 -35
- package/index.js +1 -3
- package/package.json +3 -6
- package/.gulp/build_styles_task.js +0 -30
- package/.gulp/compile_html.js +0 -308
- package/public/scripts/vanilla.min.js +0 -0
package/.grunt/compile_html.js
CHANGED
package/framework/server.js
CHANGED
package/gulpfile.js
CHANGED
|
@@ -29,12 +29,10 @@ function getCwd() {
|
|
|
29
29
|
}
|
|
30
30
|
|
|
31
31
|
const base = getCwd();
|
|
32
|
-
const cssDestination = `${getCwd()}/public/styles/app.min.css`;
|
|
33
32
|
const cssOrigin = `${getCwd()}/assets/styles/less/admin.less`;
|
|
34
|
-
const jsDestination = `${getCwd()}/public/`;
|
|
35
33
|
|
|
36
34
|
// Clean tasks
|
|
37
|
-
function
|
|
35
|
+
function cleanBuildJS() {
|
|
38
36
|
return del([`${getCwd()}/public/scripts/vanilla.min.js`], { force: true });
|
|
39
37
|
}
|
|
40
38
|
|
|
@@ -51,10 +49,11 @@ function cleanMinified() {
|
|
|
51
49
|
function buildLess() {
|
|
52
50
|
return gulp.src(cssOrigin)
|
|
53
51
|
.pipe(less({
|
|
54
|
-
compress: true,
|
|
52
|
+
//compress: true,
|
|
55
53
|
optimization: 2
|
|
56
54
|
}))
|
|
57
55
|
.pipe(rename('app.min.css'))
|
|
56
|
+
.pipe(cleanCSS())
|
|
58
57
|
.pipe(gulp.dest(`${getCwd()}/public/styles`))
|
|
59
58
|
.pipe(livereload());
|
|
60
59
|
}
|
|
@@ -126,44 +125,39 @@ function compileTemplates() {
|
|
|
126
125
|
|
|
127
126
|
// Watch task
|
|
128
127
|
function watchFiles(cb) {
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
concatJs,
|
|
153
|
-
cleanMinified,
|
|
154
|
-
compressJs
|
|
155
|
-
));
|
|
156
|
-
}
|
|
128
|
+
livereload.listen();
|
|
129
|
+
|
|
130
|
+
// Watch LESS files
|
|
131
|
+
watch([`${base}/assets/styles/less/**/*.less`], gulp.series(
|
|
132
|
+
buildLess,
|
|
133
|
+
compressCss
|
|
134
|
+
));
|
|
135
|
+
|
|
136
|
+
// Watch HTML files
|
|
137
|
+
watch([
|
|
138
|
+
`${base}/assets/pages/*.html`,
|
|
139
|
+
`${base}/assets/templates/**/*.html`
|
|
140
|
+
], compileTemplates);
|
|
141
|
+
|
|
142
|
+
// Watch JS files
|
|
143
|
+
watch([`${base}/assets/scripts/**/*.js`], gulp.series(
|
|
144
|
+
cleanBuildJS,
|
|
145
|
+
uglifyJs,
|
|
146
|
+
concatJs,
|
|
147
|
+
cleanMinified,
|
|
148
|
+
compressJs
|
|
149
|
+
));
|
|
150
|
+
|
|
157
151
|
cb();
|
|
158
152
|
}
|
|
159
153
|
|
|
160
154
|
// Define complex tasks
|
|
161
155
|
const build = gulp.series(
|
|
162
|
-
|
|
156
|
+
cleanBuildJS,
|
|
163
157
|
uglifyJs,
|
|
164
|
-
cleanBuild,
|
|
165
158
|
concatJs,
|
|
166
159
|
cleanMinified,
|
|
160
|
+
buildLess,
|
|
167
161
|
compileTemplates,
|
|
168
162
|
gulp.parallel(compressJs, compressCss)
|
|
169
163
|
);
|
|
@@ -174,7 +168,7 @@ const dev = gulp.series(
|
|
|
174
168
|
);
|
|
175
169
|
|
|
176
170
|
// Export tasks
|
|
177
|
-
exports.
|
|
171
|
+
exports.cleanBuildJS = cleanBuildJS;
|
|
178
172
|
exports.cleanMinified = cleanMinified;
|
|
179
173
|
exports.buildLess = buildLess;
|
|
180
174
|
exports.uglifyJs = uglifyJs;
|
package/index.js
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "vanilla-jet",
|
|
3
|
-
"version": "1.3.0
|
|
3
|
+
"version": "1.3.0",
|
|
4
4
|
"description": "VannilaJet framework",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"bin": {
|
|
@@ -39,9 +39,7 @@
|
|
|
39
39
|
"nodemon": "3.1.10",
|
|
40
40
|
"nunjucks": "3.2.4",
|
|
41
41
|
"underscore": ">= 1.12.x",
|
|
42
|
-
"zlib": "1.0.5"
|
|
43
|
-
},
|
|
44
|
-
"devDependencies": {
|
|
42
|
+
"zlib": "1.0.5",
|
|
45
43
|
"del": "^6.0.0",
|
|
46
44
|
"gulp": "^4.0.2",
|
|
47
45
|
"gulp-clean-css": "^4.3.0",
|
|
@@ -54,7 +52,6 @@
|
|
|
54
52
|
"gulp-rename": "^2.0.0",
|
|
55
53
|
"gulp-shell": "^0.8.0",
|
|
56
54
|
"gulp-uglify": "^3.0.2",
|
|
57
|
-
"gulp-watch": "^5.0.1"
|
|
58
|
-
"minimist": "^1.2.8"
|
|
55
|
+
"gulp-watch": "^5.0.1"
|
|
59
56
|
}
|
|
60
57
|
}
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
module.exports = function(grunt) {
|
|
2
|
-
grunt.registerTask('buildLess', 'Compile admin.less and add .section.less', function() {
|
|
3
|
-
|
|
4
|
-
// -- Functions
|
|
5
|
-
function getCleanedCWD() {
|
|
6
|
-
const cwd = process.cwd();
|
|
7
|
-
return cwd
|
|
8
|
-
.replace('/node_modules', '')
|
|
9
|
-
.replace('/vanilla-jet', '')
|
|
10
|
-
.replace('/.grunt', '');
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
// -- Content
|
|
14
|
-
let adminContent = grunt.file.read(`${getCleanedCWD()}/assets/styles/less/admin.less`);
|
|
15
|
-
let sectionFiles = grunt.file.expand([
|
|
16
|
-
`${getCleanedCWD()}/assets/styles/less/sections/**/*.section.less`,
|
|
17
|
-
`${getCleanedCWD()}/assets/styles/less/sections/*.section.less`
|
|
18
|
-
]);
|
|
19
|
-
|
|
20
|
-
let combinedContent = adminContent + '\n';
|
|
21
|
-
sectionFiles.forEach(function(filePath) {
|
|
22
|
-
let sectionContent = grunt.file.read(filePath);
|
|
23
|
-
combinedContent += `\n/* ${filePath} */\n` + sectionContent;
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
// -- New file
|
|
27
|
-
grunt.file.write(`${getCleanedCWD()}/assets/styles/less/admin_build.less`, combinedContent);
|
|
28
|
-
grunt.task.run(['less']);
|
|
29
|
-
});
|
|
30
|
-
};
|
package/.gulp/compile_html.js
DELETED
|
@@ -1,308 +0,0 @@
|
|
|
1
|
-
const fs = require('fs');
|
|
2
|
-
const path = require('path');
|
|
3
|
-
const nunjucks = require('nunjucks');
|
|
4
|
-
const beautify = require('js-beautify').html;
|
|
5
|
-
const minify = require('html-minifier-terser').minify;
|
|
6
|
-
const identifier = 'templates';
|
|
7
|
-
const chalk = require('chalk');
|
|
8
|
-
const zlib = require('zlib');
|
|
9
|
-
|
|
10
|
-
// Get environment from command line argument
|
|
11
|
-
const env = process.argv[2] || 'development';
|
|
12
|
-
if (env === 'dev') { env = 'development'; }
|
|
13
|
-
if (env === 'build:qa') { env = 'qa'; }
|
|
14
|
-
if (env === 'build:staging') { env = 'staging'; }
|
|
15
|
-
if (env === 'build:prod') { env = 'production'; }
|
|
16
|
-
|
|
17
|
-
function getCwd() {
|
|
18
|
-
return process.cwd()
|
|
19
|
-
.replace('/node_modules', '')
|
|
20
|
-
.replace('/vanilla-jet', '')
|
|
21
|
-
.replace('/.gulp', '');
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
const base = getCwd();
|
|
25
|
-
const pagesDir = path.join(base, 'assets/pages');
|
|
26
|
-
const templatesDir = path.join(base, 'assets/templates');
|
|
27
|
-
const outputDir = path.join(base, 'public');
|
|
28
|
-
|
|
29
|
-
// Configure nunjucks
|
|
30
|
-
nunjucks.configure(templatesDir, {
|
|
31
|
-
autoescape: true,
|
|
32
|
-
watch: false
|
|
33
|
-
});
|
|
34
|
-
|
|
35
|
-
// Create output directory if it doesn't exist
|
|
36
|
-
if (!fs.existsSync(outputDir)) {
|
|
37
|
-
fs.mkdirSync(outputDir, { recursive: true });
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
// Read all HTML files from pages directory
|
|
41
|
-
fs.readdir(pagesDir, (err, files) => {
|
|
42
|
-
if (err) {
|
|
43
|
-
console.error('Error reading pages directory:', err);
|
|
44
|
-
process.exit(1);
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
files.forEach(file => {
|
|
48
|
-
if (path.extname(file) === '.html') {
|
|
49
|
-
const templatePath = path.join(pagesDir, file);
|
|
50
|
-
const outputPath = path.join(outputDir, file);
|
|
51
|
-
|
|
52
|
-
// Read template file
|
|
53
|
-
fs.readFile(templatePath, 'utf8', (err, content) => {
|
|
54
|
-
if (err) {
|
|
55
|
-
console.error(`Error reading template ${file}:`, err);
|
|
56
|
-
return;
|
|
57
|
-
}
|
|
58
|
-
|
|
59
|
-
try {
|
|
60
|
-
// Render template with nunjucks
|
|
61
|
-
const rendered = nunjucks.renderString(content);
|
|
62
|
-
|
|
63
|
-
// Process the HTML based on environment
|
|
64
|
-
let processedHtml;
|
|
65
|
-
if (env === 'development') {
|
|
66
|
-
// In development, beautify the HTML
|
|
67
|
-
processedHtml = beautify(rendered, {
|
|
68
|
-
indent_size: 2,
|
|
69
|
-
preserve_newlines: true,
|
|
70
|
-
max_preserve_newlines: 2,
|
|
71
|
-
wrap_line_length: 0
|
|
72
|
-
});
|
|
73
|
-
} else {
|
|
74
|
-
// In other environments, minify the HTML
|
|
75
|
-
processedHtml = minify(rendered, {
|
|
76
|
-
collapseWhitespace: true,
|
|
77
|
-
removeComments: true,
|
|
78
|
-
minifyCSS: true,
|
|
79
|
-
minifyJS: true
|
|
80
|
-
});
|
|
81
|
-
}
|
|
82
|
-
|
|
83
|
-
// Write the processed HTML to output file
|
|
84
|
-
fs.writeFile(outputPath, processedHtml, err => {
|
|
85
|
-
if (err) {
|
|
86
|
-
console.error(`Error writing file ${file}:`, err);
|
|
87
|
-
} else {
|
|
88
|
-
console.log(`Successfully compiled ${file}`);
|
|
89
|
-
}
|
|
90
|
-
});
|
|
91
|
-
} catch (err) {
|
|
92
|
-
console.error(`Error processing template ${file}:`, err);
|
|
93
|
-
}
|
|
94
|
-
});
|
|
95
|
-
}
|
|
96
|
-
});
|
|
97
|
-
});
|
|
98
|
-
|
|
99
|
-
let Functions = require('../framework/functions.js');
|
|
100
|
-
let Dipper = require('../framework/dipper.js');
|
|
101
|
-
let Config = require(processCwd() + '/config.js');
|
|
102
|
-
|
|
103
|
-
// -- Init Dipper
|
|
104
|
-
let settings = Config.settings;
|
|
105
|
-
settings['shared']['environment'] = env;
|
|
106
|
-
|
|
107
|
-
let opts = settings[env] || {},
|
|
108
|
-
shared = settings['shared'] || {};
|
|
109
|
-
const dipper = new Dipper(opts, shared);
|
|
110
|
-
|
|
111
|
-
// -- Hydrate dipper
|
|
112
|
-
Functions.hydrate(dipper);
|
|
113
|
-
|
|
114
|
-
// -- Making nunjucks
|
|
115
|
-
let nunjucksPath = path.join(processCwd(), '/assets');
|
|
116
|
-
nunjucks.configure(nunjucksPath, {
|
|
117
|
-
autoescape: false,
|
|
118
|
-
throwOnUndefined: true,
|
|
119
|
-
noCache: true
|
|
120
|
-
});
|
|
121
|
-
|
|
122
|
-
// -- Template directory
|
|
123
|
-
const templatesDirectoryPath = '/assets/templates/';
|
|
124
|
-
|
|
125
|
-
// -- Call main function
|
|
126
|
-
main();
|
|
127
|
-
|
|
128
|
-
// -- Define mainfunctions on other functions
|
|
129
|
-
function main() {
|
|
130
|
-
|
|
131
|
-
// -- Get template files
|
|
132
|
-
const templates = getTemplates(templatesDirectoryPath);
|
|
133
|
-
//console.log(templates);
|
|
134
|
-
|
|
135
|
-
// -- Get home.html
|
|
136
|
-
let homePageName = 'home.html';
|
|
137
|
-
getHtmlFromPage(homePageName).then((htmlContent) => {
|
|
138
|
-
if (htmlContent) {
|
|
139
|
-
// -- Divide content line by line
|
|
140
|
-
const htmlContentLines = htmlContent.split('\n');
|
|
141
|
-
let lines = Array.from(htmlContentLines);
|
|
142
|
-
// -- Iterate over each line
|
|
143
|
-
for (let line of htmlContentLines) {
|
|
144
|
-
let originalLine = line;
|
|
145
|
-
// -- Remove spaces and tabs
|
|
146
|
-
line = cleanALine(line);
|
|
147
|
-
// -- Check is not empty and not a tag
|
|
148
|
-
if (line.length != 0 && !line.includes('<')) {
|
|
149
|
-
|
|
150
|
-
// -- Get template name
|
|
151
|
-
var templateName = line.replace('include::', '');
|
|
152
|
-
// -- Check if its name "templates" add all templates if not add specific one
|
|
153
|
-
if (templateName === identifier) {
|
|
154
|
-
|
|
155
|
-
let allTemplatesCompiled = '';
|
|
156
|
-
for (let templateName in templates) {
|
|
157
|
-
if (templateName.includes('template.html')) {
|
|
158
|
-
let templatePath = templates[templateName];
|
|
159
|
-
let templateCompiled = compileTemplate(templatePath);
|
|
160
|
-
allTemplatesCompiled += templateCompiled;
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
lines = replaceInclude(lines, originalLine, allTemplatesCompiled);
|
|
164
|
-
|
|
165
|
-
} else {
|
|
166
|
-
let templatePath = templates[templateName];
|
|
167
|
-
let templateCompiled = compileTemplate(templatePath);
|
|
168
|
-
lines = replaceInclude(lines, originalLine, templateCompiled);
|
|
169
|
-
}
|
|
170
|
-
}
|
|
171
|
-
}
|
|
172
|
-
// -- Join lines
|
|
173
|
-
const newHtml = lines.join('\n');
|
|
174
|
-
// -- Create HTML file
|
|
175
|
-
createHTMLFile(newHtml, homePageName);
|
|
176
|
-
// -- Console finish
|
|
177
|
-
console.log(chalk.green("\n\nVanillaJet - Finish build"));
|
|
178
|
-
}
|
|
179
|
-
});
|
|
180
|
-
}
|
|
181
|
-
|
|
182
|
-
// -- Step 0
|
|
183
|
-
function getTemplates(directory) {
|
|
184
|
-
|
|
185
|
-
const results = {};
|
|
186
|
-
|
|
187
|
-
// -- Sub functions
|
|
188
|
-
function exploreDirectory(dir) {
|
|
189
|
-
const files = fs.readdirSync(dir);
|
|
190
|
-
files.forEach(function (file) {
|
|
191
|
-
//console.log(file);
|
|
192
|
-
if (!checkExcludes(file)) {
|
|
193
|
-
const filePath = path.join(dir, file);
|
|
194
|
-
//console.log(filePath);
|
|
195
|
-
const stats = fs.statSync(filePath);
|
|
196
|
-
if (stats.isFile()) {
|
|
197
|
-
const extension = path.extname(file).toLowerCase();
|
|
198
|
-
if (extension === '.html') {
|
|
199
|
-
results[file] = filePath;
|
|
200
|
-
}
|
|
201
|
-
} else if (stats.isDirectory()) {
|
|
202
|
-
exploreDirectory(filePath);
|
|
203
|
-
}
|
|
204
|
-
}
|
|
205
|
-
});
|
|
206
|
-
}
|
|
207
|
-
|
|
208
|
-
function checkExcludes(file) {
|
|
209
|
-
|
|
210
|
-
const excludes = ['.DS_Store'];
|
|
211
|
-
for (const esclude of excludes) {
|
|
212
|
-
if (file.includes(esclude)) {
|
|
213
|
-
return true;
|
|
214
|
-
}
|
|
215
|
-
}
|
|
216
|
-
return false;
|
|
217
|
-
}
|
|
218
|
-
|
|
219
|
-
// -- Main code
|
|
220
|
-
const templatesPath = path.join(processCwd(), directory);
|
|
221
|
-
exploreDirectory(templatesPath);
|
|
222
|
-
return results;
|
|
223
|
-
}
|
|
224
|
-
|
|
225
|
-
// -- Step 1
|
|
226
|
-
async function getHtmlFromPage(page) {
|
|
227
|
-
|
|
228
|
-
const filename = path.join(processCwd(), '/assets/');
|
|
229
|
-
const exists = await fs.promises.access(filename, fs.constants.F_OK).then(() => true).catch(() => false);
|
|
230
|
-
if (!exists) {
|
|
231
|
-
console.log("Assets folder doesnt exists");
|
|
232
|
-
return null;
|
|
233
|
-
}
|
|
234
|
-
|
|
235
|
-
let fileContent;
|
|
236
|
-
if (await fs.promises.stat(filename).then((stats) => stats.isDirectory())) {
|
|
237
|
-
const filePath = path.join(filename, 'pages/' + page);
|
|
238
|
-
try {
|
|
239
|
-
fileContent = await fs.promises.readFile(filePath, { encoding: 'utf8' });
|
|
240
|
-
} catch (err) {
|
|
241
|
-
console.log("Error in Home");
|
|
242
|
-
return null;
|
|
243
|
-
}
|
|
244
|
-
}
|
|
245
|
-
return fileContent;
|
|
246
|
-
}
|
|
247
|
-
|
|
248
|
-
// -- Step 2
|
|
249
|
-
function compileTemplate(path) {
|
|
250
|
-
|
|
251
|
-
// -- Data
|
|
252
|
-
let data = { 'app': dipper }
|
|
253
|
-
|
|
254
|
-
// -- Render
|
|
255
|
-
return nunjucks.render(path, data);
|
|
256
|
-
}
|
|
257
|
-
|
|
258
|
-
// -- Step 3
|
|
259
|
-
function replaceInclude(lines, originalLine, templateCompiled) {
|
|
260
|
-
const index = lines.indexOf(originalLine);
|
|
261
|
-
if (index !== -1) {
|
|
262
|
-
lines.splice(index, 1, templateCompiled);
|
|
263
|
-
}
|
|
264
|
-
return lines;
|
|
265
|
-
}
|
|
266
|
-
|
|
267
|
-
// -- Step 4
|
|
268
|
-
async function createHTMLFile(content, filePath) {
|
|
269
|
-
const { minify } = require('html-minifier-terser');
|
|
270
|
-
const minified = await minify(content, {
|
|
271
|
-
collapseWhitespace: true,
|
|
272
|
-
collapseInlineTagWhitespace: true,
|
|
273
|
-
removeComments: true,
|
|
274
|
-
collapseBooleanAttributes: true,
|
|
275
|
-
useShortDoctype: true,
|
|
276
|
-
removeEmptyAttributes: true,
|
|
277
|
-
removeOptionalTags: true,
|
|
278
|
-
minifyJS: true
|
|
279
|
-
});
|
|
280
|
-
|
|
281
|
-
const publicPath = path.join(processCwd(), '/public/pages');
|
|
282
|
-
fs.mkdirSync(publicPath, { recursive: true });
|
|
283
|
-
const absolutePath = path.join(publicPath, filePath);
|
|
284
|
-
|
|
285
|
-
// Write the minified HTML file
|
|
286
|
-
fs.writeFileSync(absolutePath, minified, 'utf8');
|
|
287
|
-
|
|
288
|
-
// Create gzipped version
|
|
289
|
-
const gzipped = zlib.gzipSync(minified, { level: 9 }); // Maximum compression level
|
|
290
|
-
fs.writeFileSync(`${absolutePath}.gz`, gzipped);
|
|
291
|
-
|
|
292
|
-
console.log(chalk.green(`Created HTML file at: ${absolutePath}`));
|
|
293
|
-
console.log(chalk.green(`Created gzipped version at: ${absolutePath}.gz`));
|
|
294
|
-
}
|
|
295
|
-
|
|
296
|
-
// -- Helpers
|
|
297
|
-
function cleanALine(line) {
|
|
298
|
-
line = line.replaceAll(' ', '');
|
|
299
|
-
line = line.replaceAll('\t', '');
|
|
300
|
-
line = line.replaceAll('\n', '');
|
|
301
|
-
return line;
|
|
302
|
-
}
|
|
303
|
-
|
|
304
|
-
function processCwd() {
|
|
305
|
-
return process.cwd()
|
|
306
|
-
.replace('/.grunt', '')
|
|
307
|
-
.replace('/node_modules/vanilla-jet', '');
|
|
308
|
-
}
|
|
File without changes
|