From 36a5528fbd972260b3eb350b6fcf469c640e04e3 Mon Sep 17 00:00:00 2001 From: DPTeamMember Date: Tue, 25 May 2021 18:52:06 +0530 Subject: [PATCH] Upgrade to webpack 5 --- .gitignore | 1 + browserslist | 1 + package.json | 35 ++++++++++++++++++----------------- webpack/config.js | 14 +++++++------- webpack/rules/images.js | 2 +- webpack/rules/sass.js | 24 +++++++++++++++--------- 6 files changed, 43 insertions(+), 34 deletions(-) diff --git a/.gitignore b/.gitignore index 9848098..dc354c5 100755 --- a/.gitignore +++ b/.gitignore @@ -30,3 +30,4 @@ package-lock.json # ---------------------------- build/ +dist/ diff --git a/browserslist b/browserslist index ba62021..ce55174 100755 --- a/browserslist +++ b/browserslist @@ -1 +1,2 @@ Last 3 versions +IE 11 \ No newline at end of file diff --git a/package.json b/package.json index 0180410..c909885 100644 --- a/package.json +++ b/package.json @@ -1,14 +1,14 @@ { "name": "adminator", - "version": "1.0.0", + "version": "1.1.0", "private": true, "description": "HTML Admin Template", "scripts": { - "start": "webpack-dev-server", - "dev": "webpack-dashboard -t 'Project' -- webpack-dev-server", - "clean": "shx rm -rf ./build", + "start": "webpack server", + "dev": "webpack-dashboard -t 'Project' -- webpack server", + "clean": "shx rm -rf ./dist", "build": "npm run clean && cross-env webpack", - "preview": "cross-env webpack-dev-server", + "preview": "cross-env webpack server", "lint:js": "eslint ./src ./webpack ./*.js -f table --ext .js --ext .jsx", "lint:scss": "stylelint ./src/**/*.scss --syntax scss", "lint": "npm run lint:js && npm run lint:scss" @@ -25,26 +25,27 @@ "babel-preset-env": "^1.7.0", "babel-preset-stage-0": "^6.24.1", "case-sensitive-paths-webpack-plugin": "^2.4.0", - "copy-webpack-plugin": "^5.1.1", + "copy-webpack-plugin": "^6.4.1", "cross-env": "^7.0.3", - "css-loader": "^1.0.1", + "css-loader": "^5.2.6", "eslint": "^7.21.0", "eslint-config-airbnb-base": "^14.2.1", "eslint-plugin-import": "2.22.1", "extract-text-webpack-plugin": "^3.0.2", - "html-webpack-plugin": "^4.0.0", + "html-webpack-plugin": "^5.3.1", "imagemin-webpack-plugin": "^2.4.2", - "mini-css-extract-plugin": "^0.8.0", + "mini-css-extract-plugin": "^1.6.0", "node-sass": "^4.14.1", - "postcss-loader": "^3.0.0", + "postcss": "^8.3.0", + "postcss-loader": "^5.3.0", "postcss-preset-env": "^6.7.0", - "sass-loader": "^7.3.1", + "sass-loader": "^11.1.1", "shx": "^0.3.3", - "style-loader": "^1.3.0", - "stylelint": "^13.11.0", - "stylelint-config-standard": "^20.0.0", - "webpack": "^4.46.0", - "webpack-cli": "^3.3.12", + "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" }, @@ -56,7 +57,7 @@ "chart.js": "^2.9.4", "datatables": "^1.10.18", "easy-pie-chart": "^2.1.7", - "file-loader": "^2.0.0", + "file-loader": "^6.2.0", "fullcalendar": "^3.10.0", "jquery": "^3.6.0", "jquery-sparkline": "^2.4.0", diff --git a/webpack/config.js b/webpack/config.js index 2c5a9a2..8da62a9 100755 --- a/webpack/config.js +++ b/webpack/config.js @@ -50,16 +50,16 @@ const resolve = { // ----------------- module.exports = { - devtool: manifest.IS_PRODUCTION ? false : 'cheap-eval-source-map', + devtool: manifest.IS_PRODUCTION ? false : 'source-map', context: path.join(manifest.paths.src, manifest.entries.js), - watch: !manifest.IS_PRODUCTION, + // watch: !manifest.IS_PRODUCTION, entry, mode: manifest.NODE_ENV, - output: { - path: manifest.paths.build, - publicPath: '', - filename: manifest.outputFiles.bundle, - }, + // output: { + // path: manifest.paths.build, + // publicPath: '', + // filename: manifest.outputFiles.bundle, + // }, module: { rules, }, diff --git a/webpack/rules/images.js b/webpack/rules/images.js index 7dd129d..edf966f 100755 --- a/webpack/rules/images.js +++ b/webpack/rules/images.js @@ -1,5 +1,5 @@ module.exports = { - test : /\.(png|gif|jpg|svg)$/i, + test : /\.(png|gif|jpg?g|svg)$/i, exclude : /(node_modules)/, use : [{ loader: 'file-loader', diff --git a/webpack/rules/sass.js b/webpack/rules/sass.js index 9f4d746..ebbbbff 100755 --- a/webpack/rules/sass.js +++ b/webpack/rules/sass.js @@ -28,27 +28,33 @@ const loaders = [ loader: 'css-loader', options: { sourceMap : manifest.IS_DEVELOPMENT, - minimize : manifest.IS_PRODUCTION, + // minimize : manifest.IS_PRODUCTION, }, }, { loader: 'postcss-loader', options: { sourceMap: manifest.IS_DEVELOPMENT, - plugins: () => [ - cssNext(), - ], + postcssOptions: { + plugins: [ + [ + cssNext(), + ], + ], + }, }, }, { loader: 'sass-loader', options: { sourceMap: manifest.IS_DEVELOPMENT, - includePaths: [ - path.join('../../', 'node_modules'), - path.join(manifest.paths.src, 'assets', 'styles'), - path.join(manifest.paths.src, ''), - ], + sassOptions: { + includePaths: [ + path.join('../../', 'node_modules'), + path.join(manifest.paths.src, 'assets', 'styles'), + path.join(manifest.paths.src, ''), + ], + }, }, }, ];