optolith/optolith-client
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

build(webpack): use webpack for bundling scss files

Browse Source
This commit is contained in:
Lukas Obermann
2023-06-03 00:09:58 +02:00
parent dd8a91d0f8
commit 0620d76d8d
6 changed files with 296 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files
package-lock.json
Generated
+244
View File
@@ -71,7 +71,9 @@
"html-webpack-plugin": "^5.5.1",
"husky": "^4.3.8",
"jest": "^29.5.0",
"mini-css-extract-plugin": "^2.7.6",
"optolith-tsjsonschemamd": "^0.9.3",
"resolve-url-loader": "^5.0.0",
"sass": "^1.62.1",
"sass-loader": "^13.3.1",
"ssh2-sftp-client": "^9.0.1",
@@ -2962,6 +2964,33 @@
"integrity": "sha1-anmQQ3ynNtXhKI25K9MmbV9csqo=",
"dev": true
},
"node_modules/adjust-sourcemap-loader": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/adjust-sourcemap-loader/-/adjust-sourcemap-loader-4.0.0.tgz",
"integrity": "sha512-OXwN5b9pCUXNQHJpwwD2qP40byEmSgzj8B4ydSN0uMNYWiFmJ6x6KwUllMmfk8Rwu/HJDFR7U8ubsWBoN0Xp0A==",
"dev": true,
"dependencies": {
"loader-utils": "^2.0.0",
"regex-parser": "^2.2.11"
},
"engines": {
"node": ">=8.9"
}
},
"node_modules/adjust-sourcemap-loader/node_modules/loader-utils": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
"dev": true,
"dependencies": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
},
"engines": {
"node": ">=8.9.0"
}
},
"node_modules/adm-zip": {
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/adm-zip/-/adm-zip-0.5.5.tgz",
@@ -3013,6 +3042,18 @@
}
}
},
"node_modules/ajv-keywords": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
"integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
"dev": true,
"dependencies": {
"fast-deep-equal": "^3.1.3"
},
"peerDependencies": {
"ajv": "^8.8.2"
}
},
"node_modules/ansi-align": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz",
@@ -3532,6 +3573,15 @@
"tweetnacl": "^0.14.3"
}
},
"node_modules/big.js": {
"version": "5.2.2",
"resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
"integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
"dev": true,
"engines": {
"node": "*"
}
},
"node_modules/binary-extensions": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@@ -6085,6 +6135,15 @@
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
},
"node_modules/emojis-list": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
"integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
"dev": true,
"engines": {
"node": ">= 4"
}
},
"node_modules/end-of-stream": {
"version": "1.4.4",
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
@@ -11203,6 +11262,44 @@
"node": ">=4"
}
},
"node_modules/mini-css-extract-plugin": {
"version": "2.7.6",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.6.tgz",
"integrity": "sha512-Qk7HcgaPkGG6eD77mLvZS1nmxlao3j+9PkrT9Uc7HAE1id3F41+DdBRYRYkbyfNRGzm8/YWtzhw7nVPmwhqTQw==",
"dev": true,
"dependencies": {
"schema-utils": "^4.0.0"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
},
"peerDependencies": {
"webpack": "^5.0.0"
}
},
"node_modules/mini-css-extract-plugin/node_modules/schema-utils": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.0.1.tgz",
"integrity": "sha512-lELhBAAly9NowEsX0yZBlw9ahZG+sK/1RJ21EpzdYHKEs13Vku3LJ+MIPhh4sMs0oCCeufZQEQbMekiA4vuVIQ==",
"dev": true,
"dependencies": {
"@types/json-schema": "^7.0.9",
"ajv": "^8.9.0",
"ajv-formats": "^2.1.1",
"ajv-keywords": "^5.1.0"
},
"engines": {
"node": ">= 12.13.0"
},
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/webpack"
}
},
"node_modules/minimatch": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
@@ -12845,6 +12942,12 @@
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",
"integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew=="
},
"node_modules/regex-parser": {
"version": "2.2.11",
"resolved": "https://registry.npmjs.org/regex-parser/-/regex-parser-2.2.11.tgz",
"integrity": "sha512-jbD/FT0+9MBU2XAZluI7w2OBs1RBi6p9M83nkoZayQXXU9e8Robt69FcZc7wU4eJD/YFTjn1JdCk3rbMJajz8Q==",
"dev": true
},
"node_modules/regexp.prototype.flags": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.4.1.tgz",
@@ -13066,6 +13169,42 @@
"node": ">=8"
}
},
"node_modules/resolve-url-loader": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-5.0.0.tgz",
"integrity": "sha512-uZtduh8/8srhBoMx//5bwqjQ+rfYOUq8zC9NrMUGtjBiGTtFJM42s58/36+hTqeqINcnYe08Nj3LkK9lW4N8Xg==",
"dev": true,
"dependencies": {
"adjust-sourcemap-loader": "^4.0.0",
"convert-source-map": "^1.7.0",
"loader-utils": "^2.0.0",
"postcss": "^8.2.14",
"source-map": "0.6.1"
},
"engines": {
"node": ">=12"
}
},
"node_modules/resolve-url-loader/node_modules/convert-source-map": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
"integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==",
"dev": true
},
"node_modules/resolve-url-loader/node_modules/loader-utils": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
"dev": true,
"dependencies": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
},
"engines": {
"node": ">=8.9.0"
}
},
"node_modules/resolve.exports": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/resolve.exports/-/resolve.exports-2.0.2.tgz",
@@ -17825,6 +17964,29 @@
"integrity": "sha1-anmQQ3ynNtXhKI25K9MmbV9csqo=",
"dev": true
},
"adjust-sourcemap-loader": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/adjust-sourcemap-loader/-/adjust-sourcemap-loader-4.0.0.tgz",
"integrity": "sha512-OXwN5b9pCUXNQHJpwwD2qP40byEmSgzj8B4ydSN0uMNYWiFmJ6x6KwUllMmfk8Rwu/HJDFR7U8ubsWBoN0Xp0A==",
"dev": true,
"requires": {
"loader-utils": "^2.0.0",
"regex-parser": "^2.2.11"
},
"dependencies": {
"loader-utils": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
}
}
},
"adm-zip": {
"version": "0.5.5",
"resolved": "https://registry.npmjs.org/adm-zip/-/adm-zip-0.5.5.tgz",
@@ -17858,6 +18020,15 @@
"ajv": "^8.0.0"
}
},
"ajv-keywords": {
"version": "5.1.0",
"resolved": "https://registry.npmjs.org/ajv-keywords/-/ajv-keywords-5.1.0.tgz",
"integrity": "sha512-YCS/JNFAUyr5vAuhk1DWm1CBxRHW9LbJ2ozWeemrIqpbsqKjHVxYPyi5GC0rjZIT5JxJ3virVTS8wk4i/Z+krw==",
"dev": true,
"requires": {
"fast-deep-equal": "^3.1.3"
}
},
"ansi-align": {
"version": "3.0.1",
"resolved": "https://registry.npmjs.org/ansi-align/-/ansi-align-3.0.1.tgz",
@@ -18246,6 +18417,12 @@
"tweetnacl": "^0.14.3"
}
},
"big.js": {
"version": "5.2.2",
"resolved": "https://registry.npmjs.org/big.js/-/big.js-5.2.2.tgz",
"integrity": "sha512-vyL2OymJxmarO8gxMr0mhChsO9QGwhynfuu4+MHTAW6czfq9humCB7rKpUjDd9YUiDPU4mzpyupFSvOClAwbmQ==",
"dev": true
},
"binary-extensions": {
"version": "2.2.0",
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
@@ -20193,6 +20370,12 @@
"resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
"integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A=="
},
"emojis-list": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-3.0.0.tgz",
"integrity": "sha512-/kyM18EfinwXZbno9FyUGeFh87KC8HRQBQGildHZbEuRyWFOmv1U10o9BBp8XVZDVNNuQKyIGIu5ZYAAXJ0V2Q==",
"dev": true
},
"end-of-stream": {
"version": "1.4.4",
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.4.tgz",
@@ -23861,6 +24044,29 @@
"integrity": "sha512-I9jwMn07Sy/IwOj3zVkVik2JTvgpaykDZEigL6Rx6N9LbMywwUSMtxET+7lVoDLLd3O3IXwJwvuuns8UB/HeAg==",
"dev": true
},
"mini-css-extract-plugin": {
"version": "2.7.6",
"resolved": "https://registry.npmjs.org/mini-css-extract-plugin/-/mini-css-extract-plugin-2.7.6.tgz",
"integrity": "sha512-Qk7HcgaPkGG6eD77mLvZS1nmxlao3j+9PkrT9Uc7HAE1id3F41+DdBRYRYkbyfNRGzm8/YWtzhw7nVPmwhqTQw==",
"dev": true,
"requires": {
"schema-utils": "^4.0.0"
},
"dependencies": {
"schema-utils": {
"version": "4.0.1",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.0.1.tgz",
"integrity": "sha512-lELhBAAly9NowEsX0yZBlw9ahZG+sK/1RJ21EpzdYHKEs13Vku3LJ+MIPhh4sMs0oCCeufZQEQbMekiA4vuVIQ==",
"dev": true,
"requires": {
"@types/json-schema": "^7.0.9",
"ajv": "^8.9.0",
"ajv-formats": "^2.1.1",
"ajv-keywords": "^5.1.0"
}
}
}
},
"minimatch": {
"version": "3.1.2",
"resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.1.2.tgz",
@@ -25061,6 +25267,12 @@
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.13.7.tgz",
"integrity": "sha512-a54FxoJDIr27pgf7IgeQGxmqUNYrcV338lf/6gH456HZ/PhX+5BcwHXG9ajESmwe6WRO0tAzRUrRmNONWgkrew=="
},
"regex-parser": {
"version": "2.2.11",
"resolved": "https://registry.npmjs.org/regex-parser/-/regex-parser-2.2.11.tgz",
"integrity": "sha512-jbD/FT0+9MBU2XAZluI7w2OBs1RBi6p9M83nkoZayQXXU9e8Robt69FcZc7wU4eJD/YFTjn1JdCk3rbMJajz8Q==",
"dev": true
},
"regexp.prototype.flags": {
"version": "1.4.1",
"resolved": "https://registry.npmjs.org/regexp.prototype.flags/-/regexp.prototype.flags-1.4.1.tgz",
@@ -25223,6 +25435,38 @@
"global-dirs": "^0.1.1"
}
},
"resolve-url-loader": {
"version": "5.0.0",
"resolved": "https://registry.npmjs.org/resolve-url-loader/-/resolve-url-loader-5.0.0.tgz",
"integrity": "sha512-uZtduh8/8srhBoMx//5bwqjQ+rfYOUq8zC9NrMUGtjBiGTtFJM42s58/36+hTqeqINcnYe08Nj3LkK9lW4N8Xg==",
"dev": true,
"requires": {
"adjust-sourcemap-loader": "^4.0.0",
"convert-source-map": "^1.7.0",
"loader-utils": "^2.0.0",
"postcss": "^8.2.14",
"source-map": "0.6.1"
},
"dependencies": {
"convert-source-map": {
"version": "1.9.0",
"resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
"integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==",
"dev": true
},
"loader-utils": {
"version": "2.0.4",
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.4.tgz",
"integrity": "sha512-xXqpXoINfFhgua9xiqD8fPFHgkoq1mmmpE92WlDbm9rNRd/EbRb+Gqf908T2DMfuHjjJlksiK2RbHVOdD/MqSw==",
"dev": true,
"requires": {
"big.js": "^5.2.2",
"emojis-list": "^3.0.0",
"json5": "^2.1.2"
}
}
}
},
"resolve.exports": {
"version": "2.0.2",
"resolved": "https://registry.npmjs.org/resolve.exports/-/resolve.exports-2.0.2.tgz",
package.json
+2
View File
@@ -73,7 +73,9 @@
"html-webpack-plugin": "^5.5.1",
"husky": "^4.3.8",
"jest": "^29.5.0",
"mini-css-extract-plugin": "^2.7.6",
"optolith-tsjsonschemamd": "^0.9.3",
"resolve-url-loader": "^5.0.0",
"sass": "^1.62.1",
"sass-loader": "^13.3.1",
"ssh2-sftp-client": "^9.0.1",
webpack.config.js
+14 -23
View File
@@ -1,16 +1,17 @@
// @ts-check
import HtmlWebpackPlugin from "html-webpack-plugin";
import { dirname, resolve } from "node:path";
import { fileURLToPath } from "node:url";
import { getOptimization } from "./webpack.optimization.js";
import { rules } from "./webpack.rules.js";
import { dirname, resolve } from "node:path"
import { fileURLToPath } from "node:url"
import { mode } from "./webpack.env.js"
import { getOptimization } from "./webpack.optimization.js"
import { rendererPlugins } from "./webpack.plugins.js"
import { rules } from "./webpack.rules.js"
/** @type {import("webpack").Configuration[]} */
export default [
{
name: "main",
mode: "development",
mode,
entry: {
main: "./src/main.ts"
},
@@ -32,7 +33,7 @@ export default [
},
{
name: "database",
mode: "development",
mode,
entry: {
database: "./src/database.ts"
},
@@ -54,7 +55,7 @@ export default [
},
{
name: "renderer_main",
mode: "development",
mode,
entry: {
renderer_main: "./src/renderers/main/entry.tsx",
},
@@ -69,12 +70,7 @@ export default [
path: resolve(dirname(fileURLToPath(import.meta.url)), ".webpack"),
filename: "[name].js"
},
plugins: [
new HtmlWebpackPlugin({
filename: "[name].html",
template: "./src/renderers/template.html"
})
],
plugins: rendererPlugins,
externalsPresets: {
electronRenderer: true
},
@@ -82,7 +78,7 @@ export default [
},
{
name: "renderer_main_preload",
mode: "development",
mode,
entry: {
renderer_main_preload: "./src/renderers/main/preload.ts"
},
@@ -100,7 +96,7 @@ export default [
},
{
name: "renderer_updater",
mode: "development",
mode,
entry: {
renderer_updater: "./src/renderers/updater/entry.tsx"
},
@@ -115,12 +111,7 @@ export default [
path: resolve(dirname(fileURLToPath(import.meta.url)), ".webpack"),
filename: "[name].js"
},
plugins: [
new HtmlWebpackPlugin({
filename: "[name].html",
template: "./src/renderers/template.html"
})
],
plugins: rendererPlugins,
externalsPresets: {
electronRenderer: true
},
@@ -128,7 +119,7 @@ export default [
},
{
name: "renderer_updater_preload",
mode: "development",
mode,
entry: {
renderer_updater_preload: "./src/renderers/updater/preload.ts"
},
webpack.env.js
+2
View File
@@ -0,0 +1,2 @@
export const mode = process.env.NODE_ENV === "production" ? "production" : "development"
export const isDevelopment = mode === 'development'
webpack.plugins.js
+19
View File
@@ -0,0 +1,19 @@
// @ts-check
import HtmlWebpackPlugin from "html-webpack-plugin"
import MiniCssExtractPlugin from "mini-css-extract-plugin"
import { isDevelopment } from "./webpack.env.js"
/**
* @type {import("webpack").Configuration["plugins"]}
*/
export const rendererPlugins = [
new HtmlWebpackPlugin({
filename: "[name].html",
template: "./src/renderers/template.html"
}),
new MiniCssExtractPlugin({
filename: `assets/css/${isDevelopment ? '[name].css' : '[name].[hash].css'}`,
chunkFilename: `assets/css/${isDevelopment ? '[id].css' : '[id].[hash].css'}`
}),
]
webpack.rules.js
+15 -1
View File
@@ -1,5 +1,6 @@
// @ts-check
import MiniCssExtractPlugin from "mini-css-extract-plugin"
import { dirname, resolve } from "path"
import { fileURLToPath } from "url"
@@ -42,6 +43,19 @@ export const rules = [
},
{
test: /\.(css|sass|scss)$/,
use: ['css-loader', 'sass-loader'],
use: [
MiniCssExtractPlugin.loader,
'css-loader',
'resolve-url-loader',
{
loader: 'sass-loader',
options: {
sourceMap: true,
},
}
],
generator: {
filename: "assets/css/[name].[hash][ext][query]"
}
},
]