diff --git a/.nvmrc b/.nvmrc index 8351c19..3c03207 100644 --- a/.nvmrc +++ b/.nvmrc @@ -1 +1 @@ -14 +18 diff --git a/package.json b/package.json index 88a1fe8..107a8ad 100644 --- a/package.json +++ b/package.json @@ -16,57 +16,59 @@ "lint": "npm run lint:js && npm run lint:scss" }, "devDependencies": { - "@babel/core": "^7.13.8", - "@babel/eslint-parser": "^7.13.8", - "@babel/plugin-proposal-class-properties": "^7.13.0", - "@babel/plugin-proposal-object-rest-spread": "^7.13.8", - "@babel/plugin-transform-runtime": "^7.13.9", - "@babel/runtime": "^7.13.9", - "@popperjs/core": "^2.9.2", + "@babel/core": "^7.20.5", + "@babel/eslint-parser": "^7.19.1", + "@babel/plugin-proposal-class-properties": "^7.18.6", + "@babel/plugin-proposal-object-rest-spread": "^7.20.2", + "@babel/plugin-transform-runtime": "^7.19.6", + "@babel/runtime": "^7.20.6", + "@popperjs/core": "^2.11.6", "babel-core": "^6.26.3", - "babel-loader": "^8.2.2", + "babel-loader": "^9.1.0", "babel-preset-env": "^1.7.0", "babel-preset-stage-0": "^6.24.1", "case-sensitive-paths-webpack-plugin": "^2.4.0", - "copy-webpack-plugin": "^9.0.0", + "copy-webpack-plugin": "^11.0.0", "cross-env": "^7.0.3", - "css-loader": "^5.2.6", - "css-minimizer-webpack-plugin": "^4.0.0", - "eslint": "^7.21.0", - "eslint-config-airbnb-base": "^14.2.1", - "eslint-plugin-import": "^2.23.4", - "html-webpack-plugin": "^5.3.1", - "imagemin-webpack-plugin": "^2.4.2", - "mini-css-extract-plugin": "^1.6.0", - "node-sass": "^4.14.1", - "postcss": "^8.3.4", - "postcss-loader": "^6.1.0", - "postcss-preset-env": "7.8.0", - "sass-loader": "^12.1.0", - "shx": "^0.3.3", - "style-loader": "^2.0.0", - "stylelint": "^13.13.1", - "stylelint-config-standard": "^22.0.0", - "webpack": "^5.37.1", - "webpack-cli": "^4.7.0", - "webpack-dashboard": "^3.3.1", - "webpack-dev-server": "^3.11.2" + "css-loader": "^6.7.2", + "css-minimizer-webpack-plugin": "^4.2.2", + "eslint": "^8.29.0", + "eslint-config-airbnb-base": "^15.0.0", + "eslint-plugin-import": "^2.26.0", + "html-webpack-plugin": "^5.5.0", + "image-minimizer-webpack-plugin": "^3.8.1", + "mini-css-extract-plugin": "^2.7.2", + "node-sass": "^8.0.0", + "postcss": "^8.4.20", + "postcss-loader": "^7.0.2", + "postcss-preset-env": "^7.8.3", + "sass-loader": "^13.2.0", + "sharp": "^0.31.2", + "shx": "^0.3.4", + "style-loader": "^3.3.1", + "stylelint": "^14.16.0", + "stylelint-config-standard": "^29.0.0", + "svgo": "^3.0.2", + "webpack": "^5.75.0", + "webpack-cli": "^5.0.1", + "webpack-dashboard": "^3.3.7", + "webpack-dev-server": "^4.11.1" }, "dependencies": { - "@fullcalendar/core": "^5.7.2", - "@fullcalendar/daygrid": "^5.7.2", - "@fullcalendar/interaction": "^5.7.2", - "@fullcalendar/list": "^5.7.2", - "@fullcalendar/timegrid": "^5.7.2", + "@fullcalendar/core": "^5.11.3", + "@fullcalendar/daygrid": "^5.11.3", + "@fullcalendar/interaction": "^5.11.3", + "@fullcalendar/list": "^5.11.3", + "@fullcalendar/timegrid": "^5.11.3", "babel-polyfill": "^6.26.0", - "bootstrap": "^5.0.1", + "bootstrap": "^5.2.3", "bootstrap-datepicker": "^1.9.0", "brand-colors": "^2.1.1", "chart.js": "^2.9.4", "datatables": "^1.10.18", "easy-pie-chart": "^2.1.7", "file-loader": "^6.2.0", - "fullcalendar": "^5.7.2", + "fullcalendar": "^5.11.3", "jquery": "^3.6.0", "jquery-sparkline": "^2.4.0", "jvectormap": "^2.0.4", diff --git a/webpack/config.js b/webpack/config.js index 007dacf..56a3c0f 100755 --- a/webpack/config.js +++ b/webpack/config.js @@ -52,6 +52,7 @@ const optimization = { if (manifest.MINIFY) { optimization.minimizer = [ + ...require('./plugins/imageminPlugin'), new CssMinimizerPlugin(), new TerserPlugin() ]; @@ -74,6 +75,10 @@ module.exports = { module: { rules, }, + performance: { + maxEntrypointSize: 5120000, + maxAssetSize: 5120000 + }, optimization: optimization, resolve, plugins, diff --git a/webpack/devServer.js b/webpack/devServer.js index 7fa9655..1cf634b 100755 --- a/webpack/devServer.js +++ b/webpack/devServer.js @@ -15,28 +15,34 @@ const */ const devServer = { - contentBase : manifest.IS_PRODUCTION ? manifest.paths.build : manifest.paths.src, + static:{ + directory: manifest.IS_PRODUCTION ? manifest.paths.build : manifest.paths.src, + watch: true, + }, historyApiFallback : true, port : manifest.IS_PRODUCTION ? 3001 : 3000, compress : manifest.IS_PRODUCTION, - inline : !manifest.IS_PRODUCTION, - watchContentBase: true, hot : !manifest.IS_PRODUCTION, host : '0.0.0.0', - disableHostCheck : true, // [1] - overlay : true, - stats: { - assets : true, - children : false, - chunks : false, - hash : false, - modules : false, - publicPath : false, - timings : true, - version : false, - warnings : true, - colors : true, + allowedHosts : "all",// [1] + client:{ + overlay : true, + progress : true }, + devMiddleware: { + stats: { + assets: true, + children: false, + chunks: false, + hash: false, + modules: false, + publicPath: false, + timings: true, + version: false, + warnings: true, + colors: true, + }, + } }; diff --git a/webpack/manifest.js b/webpack/manifest.js index 6e0c8f0..c05c4fc 100755 --- a/webpack/manifest.js +++ b/webpack/manifest.js @@ -28,7 +28,7 @@ const NODE_ENV = process.env.NODE_ENV || 'development', IS_DEVELOPMENT = NODE_ENV === 'development', IS_PRODUCTION = NODE_ENV === 'production', - MINIFY = process.env.MINIFY === 'true'; + MINIFY = process.env.MINIFY === 'true'? true: IS_PRODUCTION; // ------ // @Utils diff --git a/webpack/plugins/imageminPlugin.js b/webpack/plugins/imageminPlugin.js index 84b6629..3c39e02 100755 --- a/webpack/plugins/imageminPlugin.js +++ b/webpack/plugins/imageminPlugin.js @@ -1,7 +1,31 @@ -const - manifest = require('../manifest'), - ImageminPlugin = require('imagemin-webpack-plugin').default; +const ImageMinimizerPlugin = require('image-minimizer-webpack-plugin'); -module.exports = new ImageminPlugin({ - disable: manifest.IS_DEVELOPMENT, -}); +module.exports = [ + new ImageMinimizerPlugin({ + minimizer: { + implementation: ImageMinimizerPlugin.sharpMinify, + options: { + encodeOptions: { + // Your options for `sharp` + // https://sharp.pixelplumbing.com/api-output + }, + } + } + }), + new ImageMinimizerPlugin({ + minimizer: { + implementation: ImageMinimizerPlugin.svgoMinify, + options: { + encodeOptions: { + // Pass over SVGs multiple times to ensure all optimizations are applied. False by default + multipass: true, + plugins: [ + // set of built-in plugins enabled by default + // see: https://github.com/svg/svgo#default-preset + "preset-default", + ], + }, + }, + }, + }), +]; diff --git a/webpack/plugins/index.js b/webpack/plugins/index.js index fd627dd..02f5262 100755 --- a/webpack/plugins/index.js +++ b/webpack/plugins/index.js @@ -4,7 +4,6 @@ const const plugins = []; plugins.push( - require('./imageminPlugin'), ...(require('./htmlPlugin')), ...(require('./internal')), require('./caseSensitivePlugin'), diff --git a/webpack/rules/fonts.js b/webpack/rules/fonts.js index 69e52a0..8c83a4a 100755 --- a/webpack/rules/fonts.js +++ b/webpack/rules/fonts.js @@ -1,5 +1,5 @@ module.exports = { test: /\.(eot|svg|ttf|woff|woff2)$/, exclude : /(node_modules)/, - use : ['file-loader'], + type: 'asset/resource', }; diff --git a/webpack/rules/images.js b/webpack/rules/images.js index edf966f..8982354 100755 --- a/webpack/rules/images.js +++ b/webpack/rules/images.js @@ -1,10 +1,5 @@ module.exports = { - test : /\.(png|gif|jpg?g|svg)$/i, + test : /\.(png|gif|jpg?g)$/i, exclude : /(node_modules)/, - use : [{ - loader: 'file-loader', - options: { - outputPath: 'assets', - }, - }], + type: 'asset/resource', }; diff --git a/webpack/rules/index.js b/webpack/rules/index.js index 16105c6..8fe22c7 100755 --- a/webpack/rules/index.js +++ b/webpack/rules/index.js @@ -1,6 +1,7 @@ module.exports = [ require('./js'), require('./images'), + require('./svg'), require('./css'), require('./sass'), require('./fonts'), diff --git a/webpack/rules/svg.js b/webpack/rules/svg.js new file mode 100644 index 0000000..1c0f94c --- /dev/null +++ b/webpack/rules/svg.js @@ -0,0 +1,5 @@ +module.exports = { + test: /\.(svg)$/i, + exclude : /(node_modules)/, + type: "asset", +};