Merge pull request #20 from ravasthi/package-upgrades

Package upgrades
ravasthi · Sep 18, 2021 · 8c507e3 · 8c507e3
2 parents b67a6a6 + 8b05594
commit 8c507e3
Show file tree

Hide file tree

Showing 5 changed files with 2,204 additions and 3,910 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "css3-foundation",
-  "version": "7.2.2",
+  "version": "7.3.0",
   "description": "A simple CSS3/HTML5 bootstrap for static sites and web apps",
   "main": "index.html",
   "repository": "[email protected]:ravasthi/css3-foundation.git",
@@ -11,50 +11,53 @@
     "node": ">=8.5.0"
   },
   "devDependencies": {
-    "autoprefixer": "^9.1.5",
+    "autoprefixer": "^10.3.4",
     "browser-sync": "^2.26.3",
     "browser-sync-webpack-plugin": "^2.2.2",
-    "clean-webpack-plugin": "^3.0.0",
+    "clean-webpack-plugin": "^4.0.0",
     "cross-env": "^7.0.2",
-    "css-loader": "^4.1.1",
-    "eslint": "^7.2.0",
-    "eslint-config-airbnb": "^18.1.0",
-    "eslint-config-prettier": "^6.11.0",
-    "eslint-plugin-import": "^2.21.2",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-react": "^7.20.0",
-    "eslint-plugin-sort-imports-es6-autofix": "^0.5.0",
-    "file-loader": "^6.0.0",
-    "mini-css-extract-plugin": "^0.9.0",
-    "node-sass": "^4.5.3",
+    "css-loader": "^6.2.0",
+    "eslint": "^7.32.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.24.2",
+    "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-react": "^7.25.2",
+    "eslint-plugin-react-hooks": "^4.2.0",
+    "eslint-plugin-sort-imports-es6-autofix": "^0.6.0",
+    "file-loader": "^6.2.0",
+    "mini-css-extract-plugin": "^2.2.2",
+    "node-sass": "^6.0.1",
     "npm-run-all": "^4.1.1",
-    "postcss-loader": "^3.0.0",
+    "postcss": "^8.3.6",
+    "postcss-loader": "^6.1.1",
     "prettier": "^2.0.5",
     "reset-css": "^5.0.1",
     "rimraf": "^3.0.2",
-    "sass-loader": "^9.0.2",
-    "style-loader": "^1.2.1",
-    "stylelint": "^13.2.0",
+    "sass-loader": "^12.1.0",
+    "style-loader": "^3.2.1",
+    "stylelint": "^13.13.1",
     "stylelint-config-prettier": "^8.0.1",
-    "stylelint-config-standard": "^20.0.0",
+    "stylelint-config-standard": "^22.0.0",
     "stylelint-order": "^4.0.0",
-    "susy": "^3.0.1",
-    "url-loader": "^4.1.0",
-    "webpack": "^4.44.1",
-    "webpack-cli": "^3.3.12",
-    "webpack-dev-server": "^3.10.3",
+    "susy": "^3.0.7",
+    "url-loader": "^4.1.1",
+    "webpack": "^5.51.2",
+    "webpack-cli": "^4.8.0",
+    "webpack-dev-server": "^4.1.0",
     "webpack-merge": "^5.0.9"
   },
   "dependencies": {
     "@fortawesome/fontawesome-free": "^5.4.1",
     "jquery": "^3.2.1"
   },
   "scripts": {
-    "clean-extra": "rimraf distribution/scripts/ie.js distribution/scripts/print.js distribution/scripts/styles.js",
+    "clean-fonts": "rimraf distribution/*.eot distribution/*.svg distribution/*.ttf distribution/*.woff distribution/*.woff2",
+    "clean-extra": "rimraf distribution/scripts/ie.js distribution/scripts/print.js distribution/scripts/styles.js distribution/scripts/*.LICENSE.txt",
     "lint:js": "eslint 'source/**/*.js' --config .eslintrc.js",
     "lint:scss": "stylelint 'source/**/*.scss' --syntax scss --config stylelint.config.js",
     "compile": "cross-env NODE_ENV=production webpack --config webpack.config.production.js",
     "build": "run-s lint:js lint:scss compile clean-extra",
-    "start": "cross-env NODE_ENV=development webpack-dev-server --config webpack.config.development.js"
+    "start": "cross-env NODE_ENV=development webpack serve --config webpack.config.development.js"
   }
 }
diff --git a/webpack.config.common.js b/webpack.config.common.js
@@ -1,8 +1,6 @@
 const path = require('path');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 
-const { CleanWebpackPlugin } = require('clean-webpack-plugin');
-
 const DIST_SLUG = 'distribution';
 const DIST = path.resolve(__dirname, DIST_SLUG);
 
@@ -18,6 +16,7 @@ module.exports = {
     filename: 'scripts/[name].js',
     path: DIST,
     publicPath: `/${DIST_SLUG}/`,
+    clean: true,
   },
   module: {
     rules: [
@@ -35,9 +34,10 @@ module.exports = {
           {
             loader: 'postcss-loader',
             options: {
-              // eslint-disable-next-line global-require
-              plugins: () => [require('autoprefixer')],
-              sourceMap: true,
+              postcssOptions: {
+                plugins: ['autoprefixer'],
+                sourceMap: true,
+              },
             },
           },
           {
@@ -54,13 +54,9 @@ module.exports = {
       {
         // Capture eot, svg, ttf, woff, and woff2
         test: /\.(eot|svg|ttf|woff|woff2)(\?v=\d+\.\d+\.\d+)?$/,
-        use: {
-          loader: 'url-loader',
-          options: {
-            limit: 10000,
-            name: 'fonts/[name].[ext]',
-            publicPath: '../',
-          },
+        type: 'asset/resource',
+        generator: {
+          filename: 'fonts/[name][ext][query]',
         },
       },
     ],
@@ -69,15 +65,6 @@ module.exports = {
     extensions: ['.js', '.json', '.css', '.scss'],
   },
   plugins: [
-    new CleanWebpackPlugin({
-      cleanOnceBeforeBuildPatterns: [
-        `${DIST_SLUG}/*.*`,
-        `${DIST_SLUG}/scripts/*.*`,
-        `${DIST_SLUG}/styles/*.*`,
-        `${DIST_SLUG}/fonts/*.*`,
-      ],
-      cleanAfterEveryBuildPatterns: [`!${DIST_SLUG}/fonts/*.*`],
-    }),
     new MiniCssExtractPlugin({
       filename: 'styles/[name].css',
       chunkFilename: 'styles/[id].css',

diff --git a/webpack.config.development.js b/webpack.config.development.js
@@ -14,12 +14,10 @@ module.exports = merge(common, {
   mode: 'development',
   devtool: 'inline-source-map',
   devServer: {
-    contentBase: [__dirname, path.join(__dirname, DIST_SLUG)],
+    static: [__dirname, path.join(__dirname, DIST_SLUG)],
     compress: true,
     hot: true,
-    overlay: true,
     port: PORT,
-    watchContentBase: true,
   },
   plugins: [
     new BrowserSyncPlugin(

diff --git a/webpack.config.production.js b/webpack.config.production.js
@@ -1,5 +1,6 @@
 const common = require('./webpack.config.common');
-const merge = require('webpack-merge');
+
+const { merge } = require('webpack-merge');
 
 module.exports = merge(common, {
   mode: 'production',