mirror of
https://github.com/squidfunk/mkdocs-material.git
synced 2024-09-24 19:38:27 +02:00
439 lines
13 KiB
TypeScript
439 lines
13 KiB
TypeScript
/*
|
|
* Copyright (c) 2016-2021 Martin Donath <martin.donath@squidfunk.com>
|
|
*
|
|
* Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
* of this software and associated documentation files (the "Software"), to
|
|
* deal in the Software without restriction, including without limitation the
|
|
* rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
|
|
* sell copies of the Software, and to permit persons to whom the Software is
|
|
* furnished to do so, subject to the following conditions:
|
|
*
|
|
* The above copyright notice and this permission notice shall be included in
|
|
* all copies or substantial portions of the Software.
|
|
*
|
|
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
* FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
|
|
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
|
|
* FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
|
|
* IN THE SOFTWARE.
|
|
*/
|
|
|
|
import CopyPlugin from "copy-webpack-plugin"
|
|
import EventHooksPlugin from "event-hooks-webpack-plugin"
|
|
import * as fs from "fs"
|
|
import { minify as minhtml } from "html-minifier"
|
|
import IgnoreEmitPlugin from "ignore-emit-webpack-plugin"
|
|
import ImageminPlugin from "imagemin-webpack-plugin"
|
|
import MiniCssExtractPlugin = require("mini-css-extract-plugin")
|
|
import * as path from "path"
|
|
import { toPairs } from "ramda"
|
|
import glob from "tiny-glob"
|
|
import { minify as minjs } from "terser"
|
|
import { TsconfigPathsPlugin } from "tsconfig-paths-webpack-plugin"
|
|
import { Configuration } from "webpack"
|
|
import AssetsManifestPlugin from "webpack-assets-manifest"
|
|
|
|
/* ----------------------------------------------------------------------------
|
|
* Helper functions
|
|
* ------------------------------------------------------------------------- */
|
|
|
|
/**
|
|
* Webpack base configuration
|
|
*
|
|
* @param args - Command-line arguments
|
|
*
|
|
* @returns Webpack configuration
|
|
*/
|
|
function config(args: Configuration): Configuration {
|
|
const assets = {}
|
|
return {
|
|
mode: args.mode,
|
|
|
|
/* Loaders */
|
|
module: {
|
|
rules: [
|
|
|
|
/* TypeScript */
|
|
{
|
|
test: /\.tsx?$/,
|
|
use: [
|
|
{
|
|
loader: "ts-loader",
|
|
options: {
|
|
experimentalWatchApi: true,
|
|
transpileOnly: true,
|
|
compilerOptions: {
|
|
importHelpers: true,
|
|
module: "esnext",
|
|
target: "es2015"
|
|
}
|
|
}
|
|
}
|
|
],
|
|
exclude: /\/node_modules\//
|
|
},
|
|
|
|
/* SASS stylesheets */
|
|
{
|
|
test: /\.scss$/,
|
|
use: [
|
|
MiniCssExtractPlugin.loader,
|
|
{
|
|
loader: "css-loader",
|
|
options: {
|
|
url: false,
|
|
sourceMap: true
|
|
}
|
|
},
|
|
{
|
|
loader: "postcss-loader",
|
|
options: {
|
|
postcssOptions: {
|
|
plugins: [
|
|
["autoprefixer"],
|
|
["postcss-inline-svg", {
|
|
paths: [
|
|
path.resolve(__dirname, "node_modules")
|
|
],
|
|
encode: false
|
|
}],
|
|
["postcss-svgo", {
|
|
plugins: [
|
|
{ removeDimensions: true },
|
|
{ removeViewBox: false }
|
|
],
|
|
encode: false
|
|
}]
|
|
]
|
|
},
|
|
sourceMap: true
|
|
}
|
|
},
|
|
{
|
|
loader: "sass-loader",
|
|
options: {
|
|
implementation: require("sass"),
|
|
sassOptions: {
|
|
includePaths: [
|
|
"src/assets/stylesheets",
|
|
"node_modules/modularscale-sass/stylesheets",
|
|
"node_modules/material-design-color",
|
|
"node_modules/material-shadows"
|
|
]
|
|
},
|
|
sourceMap: true
|
|
}
|
|
}
|
|
]
|
|
},
|
|
|
|
/* Search */
|
|
{
|
|
test: require.resolve("lunr"),
|
|
loader: "expose-loader",
|
|
options: {
|
|
exposes: ["lunr"]
|
|
}
|
|
}
|
|
]
|
|
},
|
|
|
|
/* Module resolver */
|
|
resolve: {
|
|
mainFields: ["es2015", "module", "main"],
|
|
modules: [
|
|
__dirname,
|
|
path.resolve(__dirname, "node_modules")
|
|
],
|
|
extensions: [".scss", ".ts", ".tsx", ".js", ".json"],
|
|
plugins: [
|
|
new TsconfigPathsPlugin()
|
|
]
|
|
},
|
|
|
|
/* Plugins */
|
|
plugins: [
|
|
new IgnoreEmitPlugin(/\/stylesheets\/.*?\.js/),
|
|
new AssetsManifestPlugin({
|
|
output: "assets/manifest.json",
|
|
assets
|
|
})
|
|
],
|
|
|
|
/* Source maps */
|
|
devtool: args.mode === "production" ? "source-map" : "eval",
|
|
|
|
/* Filter false positives and omit verbosity */
|
|
stats: {
|
|
entrypoints: false,
|
|
excludeAssets: [
|
|
/\.(icons)/,
|
|
/\/(images|lunr)\//,
|
|
/\.(html|py|yml)$/
|
|
],
|
|
warningsFilter: [
|
|
/export '.[^']+' was not found in/
|
|
]
|
|
}
|
|
}
|
|
}
|
|
|
|
/* ----------------------------------------------------------------------------
|
|
* Configuration
|
|
* ------------------------------------------------------------------------- */
|
|
|
|
/**
|
|
* Webpack configuration
|
|
*
|
|
* @param env - Webpack environment arguments
|
|
* @param args - Command-line arguments
|
|
*
|
|
* @returns Webpack configurations
|
|
*/
|
|
export default (_env: never, args: Configuration): Configuration[] => {
|
|
const hash = args.mode === "production" ? ".[chunkhash].min" : ""
|
|
const base = config(args)
|
|
return [
|
|
|
|
/* Application */
|
|
{
|
|
...base,
|
|
entry: {
|
|
"assets/javascripts/bundle": "src/assets/javascripts",
|
|
"assets/stylesheets/main": "src/assets/stylesheets/main.scss",
|
|
"assets/stylesheets/palette": "src/assets/stylesheets/palette.scss"
|
|
},
|
|
output: {
|
|
path: path.resolve(__dirname, "material"),
|
|
filename: `[name]${hash}.js`,
|
|
hashDigestLength: 8,
|
|
libraryTarget: "window"
|
|
},
|
|
|
|
/* Plugins */
|
|
plugins: [
|
|
...base.plugins || [],
|
|
|
|
/* Stylesheets */
|
|
new MiniCssExtractPlugin({
|
|
filename: `[name]${hash}.css`
|
|
}),
|
|
|
|
/* Improve performance by skipping dependencies in watch mode */
|
|
...args.watch ? [] : [
|
|
|
|
/* FontAwesome icons */
|
|
new CopyPlugin({
|
|
patterns: [
|
|
{ to: ".icons/fontawesome", from: "**/*.svg" },
|
|
{ to: ".icons/fontawesome", from: "../LICENSE.txt" }
|
|
].map(pattern => ({
|
|
context: "node_modules/@fortawesome/fontawesome-free/svgs",
|
|
...pattern
|
|
}))
|
|
}),
|
|
|
|
/* Material Design icons */
|
|
new CopyPlugin({
|
|
patterns: [
|
|
{ to: ".icons/material", from: "*.svg" },
|
|
{ to: ".icons/material", from: "../LICENSE" }
|
|
].map(pattern => ({
|
|
context: "node_modules/@mdi/svg/svg",
|
|
...pattern
|
|
}))
|
|
}),
|
|
|
|
/* GitHub octicons */
|
|
new CopyPlugin({
|
|
patterns: [
|
|
{ to: ".icons/octicons", from: "*.svg" },
|
|
{ to: ".icons/octicons", from: "../../LICENSE" }
|
|
].map(pattern => ({
|
|
context: "node_modules/@primer/octicons/build/svg",
|
|
...pattern
|
|
}))
|
|
}),
|
|
|
|
/* Search stemmers and segmenters */
|
|
new CopyPlugin({
|
|
patterns: [
|
|
{ to: "assets/javascripts/lunr", from: "min/*.js" },
|
|
{
|
|
to: "assets/javascripts/lunr/tinyseg.min.js",
|
|
from: "tinyseg.js",
|
|
transform: (content: Buffer) => minjs(`${content}`).code!
|
|
}
|
|
].map(pattern => ({
|
|
context: "node_modules/lunr-languages",
|
|
...pattern
|
|
}))
|
|
}),
|
|
|
|
/* Assets and configuration */
|
|
new CopyPlugin({
|
|
patterns: [
|
|
{ from: ".icons/*.svg" },
|
|
{ from: "assets/images/*" },
|
|
{ from: "**/*.{py,yml}" }
|
|
].map(pattern => ({
|
|
context: "src",
|
|
...pattern
|
|
}))
|
|
})
|
|
],
|
|
|
|
/* Template files */
|
|
new CopyPlugin({
|
|
patterns: [
|
|
{
|
|
from: "**/*.html",
|
|
transform: (content: Buffer) => {
|
|
const metadata = require("./package.json")
|
|
const banner =
|
|
"{#-\n" +
|
|
" This file was automatically generated - do not edit\n" +
|
|
"-#}\n"
|
|
|
|
/* Normalize line feeds and minify HTML */
|
|
const html = content.toString().replace(/\r\n/gm, "\n")
|
|
return banner + minhtml(html, {
|
|
collapseBooleanAttributes: true,
|
|
includeAutoGeneratedTags: false,
|
|
minifyCSS: true,
|
|
minifyJS: true,
|
|
removeComments: true,
|
|
removeScriptTypeAttributes: true,
|
|
removeStyleLinkTypeAttributes: true
|
|
})
|
|
|
|
/* Remove empty lines without collapsing everything */
|
|
.replace(/^\s*[\r\n]/gm, "")
|
|
|
|
/* Write theme version into template */
|
|
.replace("$md-name$", metadata.name)
|
|
.replace("$md-version$", metadata.version)
|
|
}
|
|
}
|
|
].map(pattern => ({
|
|
context: "src",
|
|
...pattern
|
|
}))
|
|
}),
|
|
|
|
/* Hooks */
|
|
new EventHooksPlugin({
|
|
afterEmit: async () => {
|
|
|
|
/* Replace asset URLs in templates */
|
|
if (args.mode === "production") {
|
|
const manifest = require("./material/assets/manifest.json")
|
|
for (const file of [
|
|
"material/base.html",
|
|
"material/overrides/main.html"
|
|
]) {
|
|
const template = toPairs<string>(manifest)
|
|
.reduce((content, [from, to]) => (
|
|
content.replace(new RegExp(
|
|
`('|")${from}\\1`, "g"),
|
|
`$1${to}$1`
|
|
)
|
|
), fs.readFileSync(file, "utf8"))
|
|
|
|
/* Save template with replaced assets */
|
|
fs.writeFileSync(file, template, "utf8")
|
|
}
|
|
}
|
|
|
|
/* Build search index for bundled icons */
|
|
const index = await glob("**/*.svg", { cwd: "material/.icons" })
|
|
fs.writeFileSync(
|
|
"material/overrides/assets/javascripts/icons.json",
|
|
JSON.stringify(index)
|
|
)
|
|
}
|
|
}),
|
|
|
|
/* Minify SVGs */
|
|
new ImageminPlugin({
|
|
svgo: {
|
|
plugins: [
|
|
{ removeDimensions: true },
|
|
{ removeViewBox: false }
|
|
]
|
|
}
|
|
})
|
|
],
|
|
|
|
/* Optimizations */
|
|
optimization: {
|
|
splitChunks: {
|
|
cacheGroups: {
|
|
vendor: {
|
|
test: /\/node_modules\//,
|
|
name: "assets/javascripts/vendor",
|
|
chunks: "all"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
|
|
/* Search worker */
|
|
{
|
|
...base,
|
|
entry: {
|
|
"assets/javascripts/worker/search":
|
|
"src/assets/javascripts/integrations/search/worker/main"
|
|
},
|
|
output: {
|
|
path: path.resolve(__dirname, "material"),
|
|
filename: `[name]${hash}.js`,
|
|
hashDigestLength: 8,
|
|
libraryTarget: "var"
|
|
}
|
|
},
|
|
|
|
/* Overrides */
|
|
{
|
|
...base,
|
|
entry: {
|
|
"overrides/assets/javascripts/bundle": "src/overrides/assets/javascripts",
|
|
"overrides/assets/stylesheets/main": "src/overrides/assets/stylesheets/main.scss"
|
|
},
|
|
output: {
|
|
path: path.resolve(__dirname, "material"),
|
|
filename: `[name]${hash}.js`,
|
|
hashDigestLength: 8,
|
|
libraryTarget: "window"
|
|
},
|
|
|
|
/* Plugins */
|
|
plugins: [
|
|
...base.plugins || [],
|
|
|
|
/* Stylesheets */
|
|
new MiniCssExtractPlugin({
|
|
filename: `[name]${hash}.css`
|
|
})
|
|
],
|
|
|
|
/* Optimizations */
|
|
optimization: {
|
|
// minimize: false,
|
|
// splitChunks: {
|
|
// cacheGroups: {
|
|
// vendor: {
|
|
// test: /\/node_modules\//,
|
|
// name: "overrides/assets/javascripts/vendor",
|
|
// chunks: "all"
|
|
// }
|
|
// }
|
|
// }
|
|
}
|
|
}
|
|
]
|
|
}
|