Update webpack (#5585)

* Update webpack

* Build demo before notebook

* Use with instead of env for actions-gh-pages

.github/workflows/release.yml

@@ -109,6 +109,13 @@ jobs:
       - uses: actions/setup-node@v4
       - uses: mwilliamson/setup-wabt-action@v3
         with: { wabt-version: "1.0.30" }
+      - name: build demo
+        run: |
+          npm install
+          npm run dist
+        env:
+          NODE_OPTIONS: "--openssl-legacy-provider"
+        working-directory: ./wasm/demo
       - name: build notebook demo
         run: |
           npm install
@@ -119,11 +126,11 @@ jobs:
         working-directory: ./wasm/notebook
       - name: Deploy demo to Github Pages
         uses: peaceiris/actions-gh-pages@v4
-        env:
-          ACTIONS_DEPLOY_KEY: ${{ secrets.ACTIONS_DEMO_DEPLOY_KEY }}
-          PUBLISH_DIR: ./wasm/demo/dist
-          EXTERNAL_REPOSITORY: RustPython/demo
-          PUBLISH_BRANCH: master
+        with:
+          deploy_key: ${{ secrets.ACTIONS_DEMO_DEPLOY_KEY }}
+          publish_dir: ./wasm/demo/dist
+          external_repository: RustPython/demo
+          publish_branch: master
 
   release:
     runs-on: ubuntu-latest
@@ -161,4 +168,4 @@ jobs:
               --target="$tag" \
               --generate-notes \
               $PRERELEASE_ARG \
-              bin/rustpython-release-*
+              bin/rustpython-release-*

wasm/notebook/package.json

@@ -12,19 +12,17 @@
         "xterm": "^3.8.0"
     },
     "devDependencies": {
-        "@wasm-tool/wasm-pack-plugin": "^1.1.0",
-        "clean-webpack-plugin": "^3.0.0",
-        "css-loader": "^3.4.1",
-        "html-webpack-plugin": "^3.2.0",
-        "mini-css-extract-plugin": "^0.9.0",
-        "raw-loader": "^4.0.0",
-        "serve": "^11.0.2",
-        "webpack": "^4.16.3",
-        "webpack-cli": "^3.1.0",
-        "webpack-dev-server": "^3.1.5"
+        "@wasm-tool/wasm-pack-plugin": "^1.7.0",
+        "css-loader": "^7.1.2",
+        "html-webpack-plugin": "^5.6.3",
+        "lezer-loader": "^0.3.0",
+        "mini-css-extract-plugin": "^2.9.2",
+        "webpack": "^5.97.1",
+        "webpack-cli": "^6.0.1",
+        "webpack-dev-server": "^5.2.0"
     },
     "scripts": {
-        "dev": "webpack-dev-server -d",
+        "dev": "webpack serve",
         "build": "webpack",
         "dist": "webpack --mode production",
         "test": "webpack --mode production && cd ../tests && pytest"

wasm/notebook/webpack.config.js

@@ -1,7 +1,6 @@
 const HtmlWebpackPlugin = require('html-webpack-plugin');
 const MiniCssExtractPlugin = require('mini-css-extract-plugin');
 const WasmPackPlugin = require('@wasm-tool/wasm-pack-plugin');
-const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 
 const path = require('path');
 const fs = require('fs');
@@ -12,6 +11,7 @@ module.exports = (env = {}) => {
         output: {
             path: path.join(__dirname, 'dist'),
             filename: 'index.js',
+            clean: true,
         },
         mode: 'development',
         resolve: {
@@ -30,15 +30,14 @@ module.exports = (env = {}) => {
                 },
                 {
                     test: /\.(woff(2)?|ttf)$/,
-                    use: {
-                        loader: 'file-loader',
-                        options: { name: 'fonts/[name].[ext]' },
+                    type: 'asset/resource',
+                    generator: {
+                        filename: 'fonts/[name].[ext]',
                     },
                 },
             ],
         },
         plugins: [
-            new CleanWebpackPlugin(),
             new HtmlWebpackPlugin({
                 filename: 'index.html',
                 template: 'src/index.ejs',
@@ -58,6 +57,9 @@ module.exports = (env = {}) => {
                 filename: 'styles.css',
             }),
         ],
+        experiments: {
+            asyncWebAssembly: true,
+        },
     };
     if (!env.noWasmPack) {
         config.plugins.push(