search

angular-architects / module-federation-plugin

MIT License
683 stars 184 forks source link

Build failed while creating shared libraries #508

Open rbuerschgens opened 2 months ago

rbuerschgens commented 2 months ago

We want to use in our project Fabric.js, but building the application after adding fabric as a dependency always fails with the error: 

X [ERROR] Could not resolve "path"

    (disabled):node_modules/fabric/node_modules/jsdom/lib/api.js:3:21:
      3 │ const path = require("path");
        ╵                      ~~~~~~

  The package "path" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "path"

    (disabled):node_modules/fabric/node_modules/jsdom/lib/jsdom/utils.js:3:21:
      3 │ const path = require("path");
        ╵                      ~~~~~~

  The package "path" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "fs"

    (disabled):node_modules/fabric/node_modules/jsdom/lib/api.js:4:19:
      4 │ const fs = require("fs").promises;
        ╵                    ~~~~

  The package "fs" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "fs"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js:3:19:
      3 │ const fs = require("fs");
        ╵                    ~~~~

  The package "fs" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "url"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/browser/resources/resource-loader.js:6:12:
      6 │ } = require("url");
        ╵             ~~~~~

  The package "url" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "http"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/http-request.js:3:21:
      3 │ const http = require("http");
        ╵                      ~~~~~~

  The package "http" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "https"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/http-request.js:4:22:
      4 │ const https = require("https");
        ╵                       ~~~~~~~

  The package "https" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "http"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/agent-factory.js:3:21:
      3 │ const http = require("http");
        ╵                      ~~~~~~

  The package "http" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "stream"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/http-request.js:7:12:
      7 │ } = require("stream");
        ╵             ~~~~~~~~

  The package "stream" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "https"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/agent-factory.js:4:22:
      4 │ const https = require("https");
        ╵                       ~~~~~~~

  The package "https" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "url"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/agent-factory.js:7:12:
      7 │ } = require("url");
        ╵             ~~~~~

  The package "url" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "zlib"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/http-request.js:8:21:
      8 │ const zlib = require("zlib");
        ╵                      ~~~~~~

  The package "zlib" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "path"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/utils.js:3:21:
      3 │ const path = require("path");
        ╵                      ~~~~~~

  The package "path" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "util"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:3:21:
      3 │ const util = require("util");
        ╵                      ~~~~~~

  The package "util" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "net"

    node_modules/fabric/node_modules/https-proxy-agent/dist/agent.js:38:38:
      38 │ const net_1 = __importDefault(require("net"));
         ╵                                       ~~~~~

  The package "net" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "net"

    node_modules/fabric/node_modules/http-proxy-agent/dist/agent.js:38:38:
      38 │ const net_1 = __importDefault(require("net"));
         ╵                                       ~~~~~

  The package "net" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "tls"

    node_modules/fabric/node_modules/https-proxy-agent/dist/agent.js:39:38:
      39 │ const tls_1 = __importDefault(require("tls"));
         ╵                                       ~~~~~

  The package "tls" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "tls"

    node_modules/fabric/node_modules/http-proxy-agent/dist/agent.js:39:38:
      39 │ const tls_1 = __importDefault(require("tls"));
         ╵                                       ~~~~~

  The package "tls" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "assert"

    node_modules/fabric/node_modules/https-proxy-agent/dist/agent.js:41:41:
      41 │ const assert_1 = __importDefault(require("assert"));
         ╵                                          ~~~~~~~~

  The package "assert" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "http"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/xhr/XMLHttpRequest-impl.js:3:34:
      3 │ const HTTP_STATUS_CODES = require("http").STATUS_CODES;
        ╵                                   ~~~~~~

  The package "http" wasn't found on the file system but is built into node. Are you trying to
  bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "child_process"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/xhr/XMLHttpRequest-impl.js:6:12:
      6 │ } = require("child_process");
        ╵             ~~~~~~~~~~~~~~~

  The package "child_process" wasn't found on the file system but is built into node. Are you trying
  to bundle for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "os"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/navigator/NavigatorConcurrentHardware-impl.js:3:19:
      3 │ const os = require("os");
        ╵                    ~~~~

  The package "os" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

X [ERROR] Could not resolve "fs"

    node_modules/fabric/node_modules/jsdom/lib/jsdom/living/xhr/xhr-utils.js:3:19:
      3 │ const fs = require("fs");
        ╵                    ~~~~

  The package "fs" wasn't found on the file system but is built into node. Are you trying to bundle
  for node? You can use "platform: 'node'" to do that, which will remove this error.

An unhandled exception occurred: Build failed with 23 errors:
(disabled):node_modules/fabric/node_modules/jsdom/lib/api.js:3:21: ERROR: Could not resolve "path"
(disabled):node_modules/fabric/node_modules/jsdom/lib/api.js:4:19: ERROR: Could not resolve "fs"
(disabled):node_modules/fabric/node_modules/jsdom/lib/jsdom/utils.js:3:21: ERROR: Could not resolve "path"
node_modules/fabric/node_modules/http-proxy-agent/dist/agent.js:38:38: ERROR: Could not resolve "net"
node_modules/fabric/node_modules/http-proxy-agent/dist/agent.js:39:38: ERROR: Could not resolve "tls"
...

We tried adding 'fabric' to the devDependencies and also put it in the skip array of our federation.config.js. That does not change anything.

The versions we are using are: @angular/cli: 17.2.0 @angular-architects/native-federation: 17.1.6 fabric: 5.3.0

Our package.json looks like this: 

{
  "name": ...,
  "version": "0.0.0",
  "scripts": {},
  "private": true,
  "dependencies": {
    "@angular-architects/native-federation": "^17.1.6",
    "@angular-architects/ngrx-toolkit": "^0.0.4",
    "@angular/animations": "^17.2.1",
    "@angular/cdk": "^17.2.0",
    "@angular/common": "^17.2.1",
    "@angular/compiler": "^17.2.1",
    "@angular/core": "^17.2.1",
    "@angular/forms": "^17.2.1",
    "@angular/platform-browser": "^17.2.1",
    "@angular/platform-browser-dynamic": "^17.2.1",
    "@angular/router": "^17.2.1",
    "@ngrx/operators": "^17.1.0",
    "@ngrx/signals": "^17.1.0",
    "@ngrx/store-devtools": "^17.1.0",
    "@ngx-translate/core": "^15.0.0",
    "@ngx-translate/http-loader": "^8.0.0",
    "es-module-shims": "^1.8.2",
    "ngx-translate-multi-http-loader": "^17.0.0",
    "rxjs": "~7.8.0",
    "tslib": "^2.3.0",
    "zone.js": "^0.14.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^17.2.0",
    "@angular/cli": "^17.2.0",
    "@angular/compiler-cli": "^17.2.1",
    "@types/fabric": "^5.3.7",
    "@types/jasmine": "~5.1.0",
    "chart.js": "^4.4.1",
    "fabric": "^5.3.0",
    "jasmine-core": "~5.1.0",
    "jsdom": "^24.0.0",
    "karma": "~6.4.0",
    "karma-chrome-launcher": "~3.2.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.1.0",
    "karma-jasmine-html-reporter": "~2.1.0",
    "prettier": "^3.2.5",
    "primeflex": "^3.3.1",
    "primeicons": "^6.0.1",
    "primeng": "^17.7.0",
    "quill": "^1.3.7",
    "typescript": "~5.2.2"
  }
}

And our federation.config.js like this:

const {
  withNativeFederation,
  shareAll,
} = require("@angular-architects/native-federation/config");

module.exports = withNativeFederation({
  name: "invoice-workflow-frontend",

  exposes: {
    ...
  },

  shared: {
    ...shareAll({
      singleton: true,
      strictVersion: true,
      requiredVersion: "auto",
    }),
  },

  skip: [
    "rxjs/ajax",
    "rxjs/fetch",
    "rxjs/testing",
    "rxjs/webSocket",
    "fabric",
    "jsdom",
    // Add further packages you don't need at runtime
  ],
});

What I don't understand is, that the build still tries to build the fabric library, do I miss something?

manfredsteyer commented 1 month ago

It seems like this is because the package contains its own build scripts (build.js, publish.js, publish.next.js). It seems like these files are recognized as separate entry points that NF tries to compile. I need to investigate why this is the case.