alois/CoqDecks
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update build process a little.

Browse Source
This commit is contained in:
Gareth Latty
2020-12-31 01:23:28 +00:00
parent d3bf724180
commit 933d0760fb
5 changed files with 1874 additions and 558 deletions
Download Patch File Download Diff File Expand all files Collapse all files
client/Dockerfile
+3 -1
View File
@@ -2,10 +2,12 @@ FROM node:14-alpine AS build
WORKDIR /md
RUN ["apk", "add", "--no-cache", "python", "make", "g++", "openjdk8-jre"]
RUN ["apk", "add", "--no-cache", "python", "make", "g++"]
ARG VERSION=dev
ENV MD_VERSION $VERSION
ARG MODE=production
ENV WEBPACK_MODE $MODE
COPY ["./package.json", "./package-lock.json", "./"]
RUN ["npm", "ci"]
client/package-lock.json
Generated
+1792 -433
View File
File diff suppressed because it is too large Load Diff
client/package.json
+2 -5
View File
@@ -21,7 +21,7 @@
],
"dependencies": {
"@fortawesome/fontawesome-free": "^5.15.1",
"@material/card": "^8.0.0",
"@material/card": "^9.0.0",
"@material/mwc-button": "^0.20.0",
"@material/mwc-fab": "^0.20.0",
"@material/mwc-icon-button": "^0.20.0",
@@ -46,7 +46,6 @@
"app-manifest-loader": "^2.4.1",
"chromecast-device-emulator": "^1.2.7",
"clean-webpack-plugin": "^3.0.0",
"closure-webpack-plugin": "^2.3.0",
"compression-webpack-plugin": "^7.1.1",
"css-hot-loader": "^1.4.4",
"css-loader": "^5.0.1",
@@ -58,8 +57,6 @@
"extract-loader": "^5.1.0",
"fibers": "^5.0.0",
"file-loader": "^6.2.0",
"google-closure-compiler": "^20201207.0.0",
"html-loader": "^1.3.2",
"html-webpack-plugin": "^4.5.0",
"mini-css-extract-plugin": "^1.3.3",
"postcss-import": "^14.0.0",
@@ -68,7 +65,7 @@
"prettier": "2.2.1",
"prettier-plugin-elm": "^0.7.0",
"resolve-url-loader": "^3.1.2",
"sass": "^1.30.0",
"sass": "^1.32.0",
"sass-loader": "^10.1.0",
"style-loader": "^2.0.0",
"terser-webpack-plugin": "^5.0.3",
client/src/html/index.html
-7
View File
@@ -9,14 +9,7 @@
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/svg+xml" href="../../assets/images/icon.svg" sizes="192x192">
<link rel="icon" type="image/png" href="../../assets/images/icon.png" sizes="64x64">
<meta name="theme-color" content="#2196F3">
<link rel="manifest" href="../webmanifest/manifest.webmanifest">
<link rel="preload" href="../../assets/fonts/nimbus-sans-l-regular.woff2" as="font" crossorigin />
<link rel="preload" href="../../assets/fonts/roboto-v18-latin-regular.woff2" as="font" crossorigin />
<link rel="preload" href="../../assets/fonts/nimbus-sans-l-700.woff2" as="font" crossorigin />
</head>
<body>
<noscript>
client/webpack.config.js
+77 -112
View File
@@ -5,8 +5,8 @@ const path = require("path");
const CompressionPlugin = require("compression-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const sass = require("sass");
const ClosurePlugin = require("closure-webpack-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const fs = require("fs");
module.exports = (env, argv) => {
const mode =
@@ -16,7 +16,7 @@ module.exports = (env, argv) => {
? process.env["WEBPACK_MODE"]
: "production";
const prod = mode === "production";
const production = mode === "production";
const dist = path.resolve(__dirname, "dist");
const src = path.resolve(__dirname, "src");
@@ -54,118 +54,36 @@ module.exports = (env, argv) => {
}
}
const cssLoaders = [
// Load CSS to inline styles.
{
loader: "css-loader",
options: { sourceMap: !prod },
},
// Transform CSS for compatibility.
{
loader: "postcss-loader",
options: {
sourceMap: !prod,
},
},
// Allow relative URLs.
{
loader: "resolve-url-loader",
options: { sourceMap: !prod },
},
// Load SASS to CSS.
{
loader: "sass-loader",
options: {
implementation: sass,
sourceMap: true,
sassOptions: {
includePaths: ["node_modules"],
},
},
},
];
const elmLoaders = [
{
loader: "elm-webpack-loader",
options: {
optimize: prod,
debug: !prod,
},
},
];
const plugins = [
new InjectMetadataPlugin(),
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
template: "src/html/index.html",
filename: "index.html",
inject: "body",
excludeChunks: ["cast"],
test: /\.html$/,
}),
new HtmlWebpackPlugin({
template: "src/html/cast.html",
filename: "cast.html",
inject: "body",
excludeChunks: ["index"],
test: /\.html$/,
}),
];
if (prod) {
cssLoaders.unshift({
loader: MiniCssExtractPlugin.loader,
});
plugins.push(
new CompressionPlugin({
test: /\.(js|css|html|webmanifest|svg)$/,
}),
new CompressionPlugin({
test: /\.(js|css|html|webmanifest|svg)$/,
filename: "[path].br[query]",
algorithm: "brotliCompress",
compressionOptions: { level: 11 }
})
);
plugins.push(new webpack.HashedModuleIdsPlugin());
} else {
cssLoaders.unshift({ loader: "style-loader" });
// Load CSS without refreshing in a dev env.
cssLoaders.unshift({
loader: "css-hot-loader",
options: {
reloadAll: true,
},
});
// Load elm without refreshing in a dev env.
// Disable if working with chromecasts.
// noinspection JSCheckFunctionSignatures
elmLoaders.unshift({ loader: "elm-hot-webpack-loader" });
plugins.push(new webpack.HotModuleReplacementPlugin());
}
return {
context: path.resolve(__dirname),
entry: {
// Main entry point.
index: "./src/ts/index.ts",
index: path.join(src, "ts", "index.ts"),
// Chromecast entry point.
cast: "./src/ts/cast.ts",
cast: path.join(src, "ts", "cast.ts"),
},
output: {
path: dist,
publicPath: "/",
filename: "assets/scripts/[name].[contenthash].js",
},
mode,
module: {
rules: [
// Elm scripts.
{
test: /\.elm$/,
exclude: [/elm-stuff/, /node_modules/],
use: elmLoaders,
use: [
...(production ? [] : [{ loader: "elm-hot-webpack-loader" }]),
{
loader: "elm-webpack-loader",
options: {
optimize: production,
debug: !production,
},
},
],
},
// Typescript scripts.
{
@@ -178,7 +96,41 @@ module.exports = (env, argv) => {
{
test: /\.s?css$/,
exclude: [/elm-stuff/, /node_modules/],
use: cssLoaders,
use: [
production
? {
loader: MiniCssExtractPlugin.loader,
}
: { loader: "style-loader" },
// Load CSS to inline styles.
{
loader: "css-loader",
options: { sourceMap: !production },
},
// Transform CSS for compatibility.
{
loader: "postcss-loader",
options: {
sourceMap: !production,
},
},
// Allow relative URLs.
{
loader: "resolve-url-loader",
options: { sourceMap: !production },
},
// Load SASS to CSS.
{
loader: "sass-loader",
options: {
implementation: sass,
sourceMap: true,
sassOptions: {
includePaths: ["node_modules"],
},
},
},
],
},
// Image assets.
{
@@ -223,21 +175,34 @@ module.exports = (env, argv) => {
extensions: [".js", ".ts", ".elm", ".scss"],
modules: ["node_modules"],
},
plugins: plugins,
plugins: [
new InjectMetadataPlugin(),
new CleanWebpackPlugin(),
new MiniCssExtractPlugin({
filename: "assets/styles/[name].[contenthash].css",
}),
new HtmlWebpackPlugin({
template: path.join(src, "html", "index.html"),
filename: "index.html",
inject: "body",
excludeChunks: ["cast"],
}),
new HtmlWebpackPlugin({
template: path.join(src, "html", "cast.html"),
filename: "cast.html",
inject: "body",
excludeChunks: ["index"],
}),
...(production
? [
new CompressionPlugin({
test: /\.(js|css|html|webmanifest|svg)$/,
}),
]
: [new webpack.HotModuleReplacementPlugin()]),
],
optimization: {
minimizer: [
new ClosurePlugin(
{
mode: "STANDARD",
platform: "java",
test: /assets\/scripts\/.*\.js$/,
},
{
compilation_level: "SIMPLE_OPTIMIZATIONS",
externs: "src/js/extern.js",
languageOut: "ECMASCRIPT6_STRICT",
}
),
new TerserPlugin({
test: /assets\/scripts\/.*\.js$/,
parallel: true,
@@ -249,7 +214,7 @@ module.exports = (env, argv) => {
}),
],
},
devtool: !prod ? "eval-source-map" : undefined,
devtool: !production ? "eval-source-map" : undefined,
devServer: {
hot: true,
allowedHosts: ["localhost"],