Upgrade frontend dependencies

This commit is contained in:
NI
2021-03-19 15:25:43 +08:00
parent 5434ab03b2
commit c3cf7fe170
4 changed files with 18169 additions and 8179 deletions

View File

@@ -1,23 +1,23 @@
module.exports = { module.exports = {
parserOptions: { parserOptions: {
parser: "babel-eslint" parser: "babel-eslint",
}, },
root: true, root: true,
env: { env: {
node: true node: true,
}, },
extends: [ extends: [
"plugin:vue/recommended", "plugin:vue/recommended",
"eslint:recommended", "eslint:recommended",
"prettier/vue", "prettier",
"plugin:prettier/recommended" "plugin:prettier/recommended",
], ],
rules: { rules: {
"vue/component-name-in-template-casing": ["error", "PascalCase"], "vue/component-name-in-template-casing": ["error", "PascalCase"],
"no-console": process.env.NODE_ENV === "production" ? "error" : "off", "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
"no-debugger": process.env.NODE_ENV === "production" ? "error" : "off" "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
}, },
globals: { globals: {
$nuxt: true $nuxt: true,
} },
}; };

26303
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@@ -3,48 +3,51 @@
"version": "0.0.0", "version": "0.0.0",
"description": "Sshwifty Web Front-end Project", "description": "Sshwifty Web Front-end Project",
"main": "", "main": "",
"dependencies": {},
"devDependencies": { "devDependencies": {
"@babel/core": "^7.13.8", "@babel/core": "^7.13.10",
"@babel/plugin-transform-runtime": "^7.13.9", "@babel/plugin-transform-runtime": "^7.13.10",
"@babel/preset-env": "^7.13.9", "@babel/preset-env": "^7.13.10",
"@babel/register": "^7.13.8", "@babel/register": "^7.13.8",
"@babel/runtime": "^7.13.9", "@babel/runtime": "^7.13.10",
"babel-eslint": "^10.1.0", "babel-eslint": "^10.1.0",
"babel-loader": "^8.2.2", "babel-loader": "^8.2.2",
"buffer": "^5.7.1", "buffer": "^6.0.3",
"clean-webpack-plugin": "^3.0.0", "clean-webpack-plugin": "^3.0.0",
"copy-webpack-plugin": "^6.4.1", "copy-webpack-plugin": "^8.0.0",
"css-loader": "^4.3.0", "css-loader": "^5.1.3",
"eslint": "^7.21.0", "css-minimizer-webpack-plugin": "^1.3.0",
"eslint-config-prettier": "^6.15.0", "eslint": "^7.22.0",
"eslint-config-prettier": "^8.1.0",
"eslint-loader": "^4.0.2", "eslint-loader": "^4.0.2",
"eslint-plugin-prettier": "^3.3.1", "eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-vue": "^6.2.2", "eslint-plugin-vue": "^7.7.0",
"favicons-webpack-plugin": "^4.2.0", "favicons": "^6.2.1",
"favicons-webpack-plugin": "^5.0.2",
"file-loader": "^6.2.0", "file-loader": "^6.2.0",
"fontfaceobserver": "^2.1.0", "fontfaceobserver": "^2.1.0",
"hack-font": "^3.3.0", "hack-font": "^3.3.0",
"html-loader": "^1.3.2", "html-loader": "^2.1.2",
"html-webpack-plugin": "^4.5.2", "html-webpack-plugin": "^5.3.1",
"iconv-lite": "^0.6.2", "iconv-lite": "^0.6.2",
"imagemin-webpack-plugin": "^2.4.2", "image-minimizer-webpack-plugin": "^2.2.0",
"mini-css-extract-plugin": "^0.11.3", "imagemin-gifsicle": "^7.0.0",
"mocha": "^8.3.0", "imagemin-mozjpeg": "^9.0.0",
"imagemin-pngquant": "^9.0.2",
"imagemin-svgo": "^9.0.0",
"mini-css-extract-plugin": "^1.3.9",
"mocha": "^8.3.2",
"normalize.css": "^8.0.1", "normalize.css": "^8.0.1",
"optimize-css-assets-webpack-plugin": "^5.0.4",
"prettier": "^2.2.1", "prettier": "^2.2.1",
"roboto-fontface": "^0.10.0", "roboto-fontface": "^0.10.0",
"style-loader": "^1.3.0", "style-loader": "^2.0.0",
"terser-webpack-plugin": "^4.2.3", "terser-webpack-plugin": "^5.1.1",
"vue": "^2.6.12", "vue": "^2.6.12",
"vue-loader": "^15.9.6", "vue-loader": "^15.9.6",
"vue-template-compiler": "^2.6.12", "vue-template-compiler": "^2.6.12",
"webpack": "^4.46.0", "webpack": "^5.26.3",
"webpack-cli": "^3.3.12", "webpack-cli": "^4.5.0",
"webpack-manifest-plugin": "^2.2.0", "xterm": "^4.11.0",
"xterm": "^4.10.0", "xterm-addon-fit": "^0.5.0",
"xterm-addon-fit": "^0.4.0",
"xterm-addon-web-links": "^0.4.0" "xterm-addon-web-links": "^0.4.0"
}, },
"scripts": { "scripts": {

View File

@@ -18,17 +18,21 @@
const webpack = require("webpack"), const webpack = require("webpack"),
{ spawn } = require("child_process"), { spawn } = require("child_process"),
path = require("path"), path = require("path"),
os = require("os"),
HtmlWebpackPlugin = require("html-webpack-plugin"), HtmlWebpackPlugin = require("html-webpack-plugin"),
MiniCssExtractPlugin = require("mini-css-extract-plugin"), MiniCssExtractPlugin = require("mini-css-extract-plugin"),
OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin"), CssMinimizerPlugin = require("css-minimizer-webpack-plugin"),
VueLoaderPlugin = require("vue-loader/lib/plugin"), ImageMinimizerPlugin = require("image-minimizer-webpack-plugin"),
{ VueLoaderPlugin } = require("vue-loader"),
FaviconsWebpackPlugin = require("favicons-webpack-plugin"), FaviconsWebpackPlugin = require("favicons-webpack-plugin"),
ManifestPlugin = require("webpack-manifest-plugin"),
ImageminPlugin = require("imagemin-webpack-plugin").default,
CopyPlugin = require("copy-webpack-plugin"), CopyPlugin = require("copy-webpack-plugin"),
TerserPlugin = require("terser-webpack-plugin"), TerserPlugin = require("terser-webpack-plugin"),
{ CleanWebpackPlugin } = require("clean-webpack-plugin"); { CleanWebpackPlugin } = require("clean-webpack-plugin");
const inDevMode = process.env.NODE_ENV === "development";
process.traceDeprecation = true;
let appSpawnProc = null, let appSpawnProc = null,
appBuildProc = null; appBuildProc = null;
@@ -182,12 +186,11 @@ module.exports = {
entry: { entry: {
app: path.join(__dirname, "ui", "app.js"), app: path.join(__dirname, "ui", "app.js"),
}, },
devtool: devtool: inDevMode ? "inline-source-map" : "source-map",
process.env.NODE_ENV === "development" ? "inline-source-map" : "source-map",
output: { output: {
publicPath: "/sshwifty/assets/", publicPath: "/sshwifty/assets/",
path: path.join(__dirname, ".tmp", "dist"), path: path.join(__dirname, ".tmp", "dist"),
filename: process.env.NODE_ENV === "development" ? "[id].js" : "[hash].js", filename: "[contenthash].js",
}, },
resolve: { resolve: {
alias: { alias: {
@@ -200,80 +203,60 @@ module.exports = {
runtimeChunk: true, runtimeChunk: true,
mergeDuplicateChunks: true, mergeDuplicateChunks: true,
flagIncludedChunks: true, flagIncludedChunks: true,
occurrenceOrder: true,
providedExports: true, providedExports: true,
usedExports: true, usedExports: true,
splitChunks: splitChunks: inDevMode
process.env.NODE_ENV === "development" ? false
? {}
: { : {
chunks: "all", chunks: "all",
minSize: 102400, minSize: 102400,
maxSize: 244000, maxSize: 244000,
automaticNameDelimiter: ".", maxAsyncRequests: 6,
automaticNameMaxLength: 8, maxInitialRequests: 6,
maxAsyncRequests: 8, name: false,
maxInitialRequests: 8,
name: true,
}, },
minimize: process.env.NODE_ENV !== "development", minimize: !inDevMode,
minimizer: minimizer: inDevMode
process.env.NODE_ENV === "development"
? [] ? []
: [ : [
new CssMinimizerPlugin(),
new TerserPlugin({ new TerserPlugin({
test: /\.js(\?.*)?$/i, test: /\.js(\?.*)?$/i,
terserOptions: { terserOptions: {
warnings: false, ecma: undefined,
parse: {}, parse: {},
compress: {}, compress: {},
mangle: true, mangle: true,
module: false, module: false,
passes: 2,
output: {
beautify: false,
comments: false,
}, },
toplevel: false,
nameCache: null,
ie8: false,
keep_classnames: false,
keep_fnames: false,
safari10: false,
extractComments: /^\**!|@preserve|@license|@cc_on/i, extractComments: /^\**!|@preserve|@license|@cc_on/i,
},
}), }),
], ],
}, },
module: { module: {
rules: [ rules: [
{
test: /\.css$/,
use: ["vue-style-loader", MiniCssExtractPlugin.loader, "css-loader"],
},
{
test: /\.html/,
use: "html-loader",
},
{ {
test: /\.vue$/, test: /\.vue$/,
loader: "vue-loader", use: "vue-loader",
},
{
test: /\.css$/,
use: [
inDevMode ? "vue-style-loader" : MiniCssExtractPlugin.loader,
"css-loader",
],
},
{
test: /\.html$/,
use: "html-loader",
}, },
{ {
test: /\.(woff(2)?|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/, test: /\.(woff(2)?|ttf|eot)(\?v=\d+\.\d+\.\d+)?$/,
use: "file-loader", use: "file-loader",
}, },
{ {
test: /\.(gif|png|jpe?g|svg)$/i, test: /\.(jpe?g|png|gif|svg)$/i,
use: [ type: "asset",
{
loader: "file-loader",
options: {
name: "[contenthash].[ext]",
esModule: false,
},
},
],
}, },
{ {
test: /\.js$/, test: /\.js$/,
@@ -322,13 +305,13 @@ module.exports = {
{ {
apply(compiler) { apply(compiler) {
compiler.hooks.afterEmit.tapAsync( compiler.hooks.afterEmit.tapAsync(
"AfterEmitPlugin", "AfterEmittedPlugin",
(_param, callback) => { (_params, callback) => {
killSpawnProc(appBuildProc, () => { killSpawnProc(appBuildProc, () => {
startBuildSpawnProc(() => { startBuildSpawnProc(() => {
callback(); callback();
if (process.env.NODE_ENV !== "development") { if (!inDevMode) {
return; return;
} }
@@ -349,7 +332,7 @@ module.exports = {
favicons: { favicons: {
appName: "Sshwifty SSH Client", appName: "Sshwifty SSH Client",
appDescription: "Web SSH Client", appDescription: "Web SSH Client",
developerName: "Rui NI", developerName: "Rui Ni",
developerURL: "https://vaguly.com", developerURL: "https://vaguly.com",
background: "#333", background: "#333",
theme_color: "#333", theme_color: "#333",
@@ -382,7 +365,7 @@ module.exports = {
title: "Sshwifty Web SSH Client", title: "Sshwifty Web SSH Client",
minify: { minify: {
html5: true, html5: true,
collapseWhitespace: process.env.NODE_ENV !== "development", collapseWhitespace: !inDevMode,
caseSensitive: true, caseSensitive: true,
removeComments: true, removeComments: true,
removeEmptyElements: false, removeEmptyElements: false,
@@ -402,40 +385,47 @@ module.exports = {
lang: "en-US", lang: "en-US",
minify: { minify: {
html5: true, html5: true,
collapseWhitespace: process.env.NODE_ENV !== "development", collapseWhitespace: !inDevMode,
caseSensitive: true, caseSensitive: true,
removeComments: true, removeComments: true,
removeEmptyElements: false, removeEmptyElements: false,
}, },
}), }),
new ImageminPlugin({
disable: process.env.NODE_ENV === "development",
pngquant: {
speed: 3,
strip: true,
quality: "0-3",
},
}),
new MiniCssExtractPlugin({ new MiniCssExtractPlugin({
filename: filename: inDevMode ? "[id].css" : "[contenthash].css",
process.env.NODE_ENV === "development" ? "[id].css" : "[hash].css", chunkFilename: inDevMode ? "[id].css" : "[contenthash].css",
chunkFilename:
process.env.NODE_ENV === "development"
? "[id].css"
: "[chunkhash].css",
}), }),
new OptimizeCssAssetsPlugin({
assetNameRegExp: /\.css$/,
cssProcessor: require("cssnano"),
cssProcessorPluginOptions: {
preset: ["default", { discardComments: { removeAll: true } }],
},
canPrint: true,
}),
new ManifestPlugin(),
]; ];
if (process.env.NODE_ENV !== "development") { if (!inDevMode) {
plugins.push(
new ImageMinimizerPlugin({
severityError: "warning",
deleteOriginalAssets: true,
maxConcurrency: os.cpus().length,
minimizerOptions: {
plugins: [
["gifsicle", { interlaced: true }],
["mozjpeg", { progressive: true }],
["pngquant", { quality: [0.0, 0.03] }],
[
"svgo",
{
multipass: true,
datauri: "enc",
indent: 0,
plugins: [
{
sortAttrs: true,
inlineStyle: true,
},
],
},
],
],
},
})
);
plugins.push(new CleanWebpackPlugin()); plugins.push(new CleanWebpackPlugin());
} }