Improved build script
- Executing CLI utilities instead of deasync-ing - Config file `webpage.json` (also replaces order.json) - Removed Bash build scripts
This commit is contained in:
parent
c5929f55ed
commit
ec7e74c39d
7 changed files with 119 additions and 184 deletions
|
|
@ -1,2 +0,0 @@
|
|||
#!/usr/bin/env bash
|
||||
7z a built.zip dist/*
|
||||
100
build.sh
100
build.sh
|
|
@ -1,100 +0,0 @@
|
|||
#!/usr/bin/env bash
|
||||
|
||||
RED='\033[1;31m'
|
||||
GREEN='\033[1;32m'
|
||||
YELLOW='\033[1;33m'
|
||||
BLUE='\033[1;34m'
|
||||
BOLD='\033[1m'
|
||||
RESET='\033[0m'
|
||||
|
||||
minjs="dist/script.min.js"
|
||||
mincss="dist/style.min.css"
|
||||
minhtml="dist/index.html"
|
||||
|
||||
minjs_name="script.min.js"
|
||||
mincss_name="style.min.css"
|
||||
minhtml_name="index.html"
|
||||
|
||||
title() {
|
||||
echo
|
||||
echo -e "${BLUE}[*]${RESET} $1"
|
||||
}
|
||||
|
||||
start() {
|
||||
echo
|
||||
echo -e "${YELLOW}[+]${RESET} ${BOLD}Building web site in:${RESET}"
|
||||
echo -e "${BOLD}$PWD${RESET}"
|
||||
}
|
||||
|
||||
success() {
|
||||
echo
|
||||
echo -e "${GREEN}[V]${RESET} ${BOLD}Done${RESET}"
|
||||
echo
|
||||
}
|
||||
|
||||
check_deps() {
|
||||
which "$1" >/dev/null 2>/dev/null
|
||||
if [[ $? == 1 ]]; then
|
||||
echo -e "${RED}[!]${RESET} $1 is required"
|
||||
echo
|
||||
exit 1
|
||||
fi
|
||||
}
|
||||
|
||||
js_minify() {
|
||||
order=('js/anim.js' 'js/script.js' 'js/init.js' 'js/menu.js' 'js/control.js' 'js/handlers.js')
|
||||
terser -o "$minjs" ${order[*]}
|
||||
}
|
||||
|
||||
html_minify () {
|
||||
html-minifier \
|
||||
--collapse-boolean-attributes \
|
||||
--collapse-inline-tag-whitespace \
|
||||
--collapse-whitespace \
|
||||
--remove-attribute-quotes \
|
||||
--remove-comments \
|
||||
--remove-script-type-attributes \
|
||||
--remove-style-link-type-attributes \
|
||||
--use-short-doctype \
|
||||
-o "$minhtml" \
|
||||
"$1"
|
||||
}
|
||||
|
||||
copy_files() {
|
||||
exclude=('\.$' '\.git' 'index.html' 'styles.less' 'js' 'dist' 'build.sh' 'html_conv' 'README.md')
|
||||
items="${exclude[@]}"
|
||||
regex="${items//[[:space:]]/|}"
|
||||
find -maxdepth 1 -exec bash -c "if [[ {} =~ $regex ]]; then :; else cp -r {} dist/; fi" \;
|
||||
}
|
||||
|
||||
start
|
||||
|
||||
title "Creating dist/"
|
||||
mkdir -p dist/
|
||||
|
||||
title "Checking dependencies"
|
||||
check_deps terser
|
||||
check_deps lessc
|
||||
check_deps cleancss
|
||||
check_deps html-minifier
|
||||
check_deps python3
|
||||
|
||||
title "Minifying JS"
|
||||
js_minify
|
||||
|
||||
title "Converting LESS"
|
||||
lessc "styles.less" "$mincss"
|
||||
|
||||
title "Minifying CSS"
|
||||
cleancss -o "$mincss" "$mincss"
|
||||
|
||||
title "Editing HTML"
|
||||
cat index.html | python3 html_conv.py "$minjs_name" "$mincss_name" >"$minhtml"
|
||||
|
||||
title "Minifying HTML"
|
||||
html_minify "$minhtml"
|
||||
|
||||
title "Copying other files"
|
||||
copy_files
|
||||
|
||||
success
|
||||
2
clean.sh
2
clean.sh
|
|
@ -1,2 +0,0 @@
|
|||
#!/usr/bin/env bash
|
||||
rm -rf dist/ built.zip
|
||||
121
dc09.js
121
dc09.js
|
|
@ -1,10 +1,14 @@
|
|||
const fs = require('fs')
|
||||
const path = require('path')
|
||||
|
||||
const cp = require('child_process')
|
||||
const process = require('process')
|
||||
const deasync = require('deasync')
|
||||
const exec = cp.execSync
|
||||
//const exec = cp.execSync
|
||||
const exec = (cmd) => {
|
||||
console.log(`Exec: ${cmd}`)
|
||||
return cp.execSync(cmd)
|
||||
}
|
||||
|
||||
const less = require('less')
|
||||
const CleanCSS = require('clean-css')
|
||||
const html = require('html-minifier')
|
||||
|
||||
|
|
@ -20,8 +24,6 @@ const reset = '\033[0m'
|
|||
|
||||
const minjs = 'script.min.js'
|
||||
const mincss = 'style.min.css'
|
||||
const minhtml = 'index.html'
|
||||
const root = ['.domains']
|
||||
|
||||
|
||||
main()
|
||||
|
|
@ -61,63 +63,77 @@ function main() {
|
|||
|
||||
function buildAll() {
|
||||
buildOne('.')
|
||||
print('Completed', true, 'V', green)
|
||||
}
|
||||
|
||||
function buildOne(dir) {
|
||||
|
||||
print(`${bold}Building:${reset} ${dir}`)
|
||||
fs.mkdirSync(`dist/${dir}`, {recursive: true})
|
||||
print('Minifying JS')
|
||||
minifyJs(dir)
|
||||
print('Rendering LESS')
|
||||
renderLess(dir)
|
||||
print('Minifying CSS')
|
||||
minifyCss(dir)
|
||||
print('Converting paths in HTML')
|
||||
convertPathsHtml(dir)
|
||||
print('Minifying HTML')
|
||||
minifyHtml(dir)
|
||||
}
|
||||
|
||||
function minifyJs(dir) {
|
||||
const orderFile = `${dir}/js/order.json`
|
||||
let order
|
||||
if (fs.existsSync(orderFile)) {
|
||||
order = JSON.parse(fs.readFileSync(orderFile))
|
||||
const config = `${dir}/webpage.json`
|
||||
let files
|
||||
if (fs.existsSync(config)) {
|
||||
files = JSON.parse(fs.readFileSync(config))
|
||||
}
|
||||
else {
|
||||
print(
|
||||
'Unable to find order.json, skipping',
|
||||
'Unable to find webpage.json, skipping',
|
||||
false, '!', yellow,
|
||||
)
|
||||
return
|
||||
}
|
||||
|
||||
print('Minifying JS')
|
||||
minifyJs(dir, files)
|
||||
print('Rendering LESS')
|
||||
renderLess(dir, files)
|
||||
print('Minifying CSS')
|
||||
minifyCss(dir, files)
|
||||
print('Converting paths in HTML')
|
||||
convertPathsHtml(dir, files)
|
||||
print('Minifying HTML')
|
||||
minifyHtml(dir, files)
|
||||
}
|
||||
|
||||
function minifyJs(dir, files) {
|
||||
files.js = files.js || []
|
||||
if (files.js.length == 0) return;
|
||||
exec(
|
||||
`node_modules/.bin/terser -o "dist/${dir}/${minjs}" ` +
|
||||
order.map(js => `"${dir}/js/${js}"`).join(' ')
|
||||
'node_modules/.bin/terser --compress --mangle ' +
|
||||
`-o "dist/${dir}/${minjs}" ` +
|
||||
files.js.map(js => `"${dir}/${js}"`).join(' ')
|
||||
)
|
||||
}
|
||||
|
||||
function renderLess(dir) {
|
||||
const content = deasync(less.render)(
|
||||
fs.readFileSync(`${dir}/styles.less`).toString()
|
||||
)
|
||||
fs.writeFileSync(
|
||||
`dist/${dir}/${mincss}`,
|
||||
content.css,
|
||||
function renderLess(dir, files) {
|
||||
files.less = files.less || []
|
||||
if (files.less.length == 0) return;
|
||||
rendered = path.resolve(`dist/${dir}/${mincss}`)
|
||||
exec(
|
||||
'node_modules/.bin/lessc ' +
|
||||
files.less.map(less => `"${dir}/${less}"`).join(' ') +
|
||||
` "${rendered}"`
|
||||
)
|
||||
files.css = [
|
||||
...(files.css || []),
|
||||
rendered,
|
||||
]
|
||||
}
|
||||
|
||||
function minifyCss(dir) {
|
||||
const renderedCss = `dist/${dir}/${mincss}`
|
||||
const content = new CleanCSS().minify(
|
||||
fs.readFileSync(renderedCss)
|
||||
).styles
|
||||
fs.writeFileSync(renderedCss, content)
|
||||
function minifyCss(dir, files) {
|
||||
files.css = files.css || []
|
||||
if (files.css.length == 0) return;
|
||||
const content = new CleanCSS().minify(files.css).styles
|
||||
fs.writeFileSync(`dist/${dir}/${mincss}`, content)
|
||||
}
|
||||
|
||||
function convertPathsHtml(dir) {
|
||||
function convertPathsHtml(dir, files) {
|
||||
const scriptRegex = /(?:<script src=['"]?js\/\w+\.js['"]?><\/script>[\s\r\n]*)+/gm
|
||||
const content = fs.readFileSync(`${dir}/index.html`)
|
||||
const converted = []
|
||||
files.html = files.html || []
|
||||
for (let file of files.html) {
|
||||
const content = fs.readFileSync(`${dir}/${file}`)
|
||||
.toString()
|
||||
.replace(
|
||||
'<script src="https://cdn.jsdelivr.net/npm/less"></script>',
|
||||
|
|
@ -131,13 +147,21 @@ function convertPathsHtml(dir) {
|
|||
scriptRegex,
|
||||
`<script src="${minjs}"></script>`
|
||||
)
|
||||
fs.writeFileSync(`dist/${dir}/${minhtml}`, content)
|
||||
const built = path.resolve(`dist/${dir}/${file}`)
|
||||
fs.writeFileSync(built, content)
|
||||
converted.push(built)
|
||||
}
|
||||
files.html = converted
|
||||
}
|
||||
|
||||
function minifyHtml(dir) {
|
||||
const convertedHtml = `dist/${dir}/${minhtml}`
|
||||
function minifyHtml(dir, files) {
|
||||
files.html = files.html || []
|
||||
for (let file of files.html) {
|
||||
const isAbs = path.isAbsolute(file)
|
||||
const name = (isAbs ? file : `${dir}/${file}`)
|
||||
const built = (isAbs ? file : `dist/${dir}/${file}`)
|
||||
const content = html.minify(
|
||||
fs.readFileSync(convertedHtml).toString(),
|
||||
fs.readFileSync(name).toString(),
|
||||
{
|
||||
collapseBooleanAttributes: true,
|
||||
collapseInlineTagWhitespace: true,
|
||||
|
|
@ -150,7 +174,8 @@ function minifyHtml(dir) {
|
|||
keepClosingSlash: false,
|
||||
}
|
||||
)
|
||||
fs.writeFileSync(convertedHtml, content)
|
||||
fs.writeFileSync(built, content)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
|
@ -159,7 +184,13 @@ function archive() {
|
|||
}
|
||||
|
||||
function clean() {
|
||||
exec('rm -rf dist/ dist.zip')
|
||||
fs.rmSync('dist/', {
|
||||
recursive: true,
|
||||
force: true,
|
||||
})
|
||||
fs.rmSync('dist.zip', {
|
||||
force: true,
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -1,8 +0,0 @@
|
|||
[
|
||||
"anim.js",
|
||||
"script.js",
|
||||
"init.js",
|
||||
"menu.js",
|
||||
"control.js",
|
||||
"handlers.js"
|
||||
]
|
||||
|
|
@ -1,7 +1,6 @@
|
|||
{
|
||||
"dependencies": {
|
||||
"clean-css": "^5.3.1",
|
||||
"deasync": "^0.1.28",
|
||||
"html-minifier": "^4.0.0",
|
||||
"less": "^4.1.3",
|
||||
"terser": "^5.16.1"
|
||||
|
|
|
|||
17
webpage.json
Normal file
17
webpage.json
Normal file
|
|
@ -0,0 +1,17 @@
|
|||
{
|
||||
"html": ["index.html"],
|
||||
"less": ["styles.less"],
|
||||
"css": [],
|
||||
"js": [
|
||||
"js/anim.js",
|
||||
"js/script.js",
|
||||
"js/init.js",
|
||||
"js/menu.js",
|
||||
"js/control.js",
|
||||
"js/handlers.js"
|
||||
],
|
||||
"files": [
|
||||
"img/", "svg/", "fontawesome/",
|
||||
".domains"
|
||||
]
|
||||
}
|
||||
Loading…
Add table
Reference in a new issue