fs-extra fails with ElectronJS-Forge-React and Webpack

[kuworking]

• Operating System: W10
• Node.js version: 14.15.0
• fs-extra version: 10.0.0

Following on https://github.com/jprichardson/node-fs-extra/issues/863 I'm having this error

However, I am capable of using fs-extra with "pure" electronjs

Where I'm having this error is when using ElectronJS + React and Webpack

> yarn start
yarn run v1.19.0
$ electron-forge start
✔ Checking your system
✔ Locating Application
✔ Preparing native dependencies
✔ Compiling Main Process Code
✔ Launch Dev Servers
✔ Compiling Preload Scripts
✔ Launching Application

Webpack Output Available: http://localhost:9000

⠸ Compiling Renderer CodeApp threw an error during load
Error: Module build failed (from ./node_modules/@marshallofsound/webpack-asset-relocator-loader/dist/index.js):
SyntaxError: Unexpected token (13:10)
    at Object.module.exports.pp$4.raise (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:20834:13)
    at Object.module.exports.pp.unexpected (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:18680:8)
    at Object.module.exports.pp$1.parseTryStatement (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:19069:49)
    at Object.module.exports.pp$1.parseStatement (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:18834:32)
    at Object.parseStatement (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:4539:118)
    at Object.parseStatement (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:42314:22)
    at Object.module.exports.pp$1.parseBlock (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:19157:23)
    at Object.module.exports.pp$3.parseFunctionBody (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:20675:22)
    at Object.module.exports.pp$1.parseFunction (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:19273:8)
    at Object.module.exports.pp$3.parseExprAtom (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:20219:21)
    at Object.parseExprAtom (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:4551:117)
    at Object.parseExprAtom (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:42293:75)
    at Object.parseExprAtom (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:35894:26)
    at Object.parseExprAtom (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:15975:26)
    at Object.parseExprAtom (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:380:26)
    at Object.module.exports.pp$3.parseExprSubscripts (C:\CODING\finance\node_modules\@marshallofsound\webpack-asset-relocator-loader\dist\index.js:20116:19)
    at Object../node_modules/fs-extra/lib/empty/index.js (C:\CODING\finance\.webpack\main\index.js:11379:7)
    at __webpack_require__ (C:\CODING\finance\.webpack\main\index.js:24050:42)
    at Object../node_modules/fs-extra/lib/index.js (C:\CODING\finance\.webpack\main\index.js:11564:6)
    at __webpack_require__ (C:\CODING\finance\.webpack\main\index.js:24050:42)
    at Object../src/server.js (C:\CODING\finance\.webpack\main\index.js:23545:12)
    at __webpack_require__ (C:\CODING\finance\.webpack\main\index.js:24050:42)
    at C:\CODING\finance\.webpack\main\index.js:24111:16
    at C:\CODING\finance\.webpack\main\index.js:24154:3
    at Object.<anonymous> (C:\CODING\finance\.webpack\main\index.js:24157:12)
    at Module._compile (internal/modules/cjs/loader.js:1078:30)

  },
  "dependencies": {
    "electron-squirrel-startup": "^1.0.0",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "isomorphic-unfetch": "3.1.0",
    "path": "0.12.7",
    "fs-extra": "10.0.0",
    "express": "4.17.1"
  },
  "devDependencies": {
    "@babel/core": "^7.14.6",
    "@babel/preset-react": "^7.14.5",
    "@electron-forge/cli": "^6.0.0-beta.57",
    "@electron-forge/maker-deb": "^6.0.0-beta.57",
    "@electron-forge/maker-rpm": "^6.0.0-beta.57",
    "@electron-forge/maker-squirrel": "^6.0.0-beta.57",
    "@electron-forge/maker-zip": "^6.0.0-beta.57",
    "@electron-forge/plugin-webpack": "6.0.0-beta.57",
    "@marshallofsound/webpack-asset-relocator-loader": "^0.5.0",
    "babel-loader": "^8.2.2",
    "css-loader": "^5.0.0",
    "electron": "13.1.5",
    "node-loader": "^2.0.0",
    "style-loader": "^2.0.0",
    "prettier": "2.3.2"
  }

webpack.rules.js

module.exports = [
  {
    test: /\.jsx?$/,
    use: {
      loader: 'babel-loader',
      options: {
        exclude: /node_modules/,
        presets: ['@babel/preset-react']
      }
    }
  },
  // Add support for native node modules
  {
    test: /\.node$/,
    use: 'node-loader',
  },
  {
    test: /\.(m?js|node)$/,
    parser: { amd: false },
    use: {
      loader: '@marshallofsound/webpack-asset-relocator-loader',
      options: {
        outputAssetBase: 'native_modules',
      },
    },
  },
];

[kuworking]

As said in the referred issue, downgrading to "fs-extra": "8.0.0", is a working workaround

[RyanZim]

Seems like there's something in your build toolchain that doesn't support optional catch binding syntax; that's your problem. I think it's @marshallofsound/webpack-asset-relocator-loader, using an old version of acorn. Don't know the differences; perhaps you can use https://github.com/vercel/webpack-asset-relocator-loader instead?