Search code examples
angularwebpackwebpack-5

webpack v5 configuration error: fallback parameter does not match the schema


what is wrong with my webpack-partial config in webpack v5? I have no clue why I'm getting an error about the fallback parameter when the docs explicitly say it is included here. All my logs when the webpack partial is loaded say I am using webpack 5.82.1

ERR

An unhandled exception occurred: Invalid configuration object. Webpack has been initialised using 

a configuration object that does not match the API schema.
- configuration.resolve has an unknown property 'fallback'. These properties are valid:
object { alias?, aliasFields?, cachePredicate?, cacheWithContext?, concord?, descriptionFiles?, 
enforceExtension?, enforceModuleExtension?, extensions?, fileSystem?, mainFields?, mainFiles?, 
moduleExtensions?, modules?, plugins?, resolver?, roots?, symlinks?, unsafeCache?, useSyncFileSystemCalls? }

err log file contents:

at Object.webpack [as webpackFactory] (C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\node_modules\webpack\lib\webpack.js:31:9)
    at createWebpack (C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\node_modules\@angular-devkit\build-webpack\src\webpack-dev-server\index.js:21:36)
    at Object.runWebpackDevServer (C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\node_modules\@angular-devkit\build-webpack\src\webpack-dev-server\index.js:47:12)
    at SwitchMapSubscriber.project (C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\src\dev-server\index.js:167:32)
    at SwitchMapSubscriber._next (C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\node_modules\rxjs\internal\operators\switchMap.js:47:27)
    at SwitchMapSubscriber.Subscriber.next (C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\node_modules\rxjs\internal\Subscriber.js:66:18)
    at C:\Users\i\Desktop\_REPOS\gk-datasync-frontend\serverless-site\node_modules\@angular-devkit\build-angular\node_modules\rxjs\internal\util\subscribeToPromise.js:7:24
    at processTicksAndRejections (node:internal/process/task_queues:96:5)

npm start command:

    "start": "webpack -v && ng serve --extra-webpack-config webpack.partial.js -o",

webpack.partial config:

const webpack = require('webpack');
console.log(`partial webpack version loaded:`,webpack.version)

module.exports = {
  resolve: {
    //modules: [...],
    fallback: {
      "fs": false,
      "tls": false,
      "net": false,
      "path": false,
      "zlib": false,
      "http": false,
      "https": false,
      "stream": false,
      "crypto": false,
      "mssql": false,
      "assert": false,
      "nodemailer": false,
      "xlsx": false,
      "original-fs": false,
      "url-composer": false, //if get error TS2307: Cannot find module --add here
      //"crypto-browserify": require.resolve('crypto-browserify'), //if you want to use this module also don't forget npm i crypto-browserify 
      "adm-zip": false,
      "assert": false,
      "os": false,
      "axios-ntlm": false,
      "http": false,
      "https": false,
      "stream-http": false,
      "https-browserify": false
    }
  },
  plugins: [
    new webpack.DefinePlugin({
      "VERSION": JSON.stringify("4711")
    })
  ]
}

Solution

  • I followed the webpack error messages (despite them not matching the docs) and I wound up with a working config. Here is what I had to change:

    module.exports = {
      resolve: {
        //modules: [...],
        resolver:{
        fallback: {
          "fs": false,
          ......
    

    Note that resolve has a child of resolver which contains the fallbacks