circular dependency N3DataFactory.js -> N3Util.js -> N3DataFactory.js breaks the build

[ckemmler]

Trying to add Solid support to my Obsidian Social plugin, I'm seeing the following error while building (npm run dev):

node_modules/@inrupt/solid-client/dist/rdfjs.internal.mjs -> node_modules/@inrupt/solid-client/dist/datatypes.mjs -> node_modules/@inrupt/solid-client/dist/rdfjs.internal.mjs
node_modules/n3/src/N3DataFactory.js -> node_modules/n3/src/N3Util.js -> node_modules/n3/src/N3DataFactory.js

package.json:

{
    "name": "sekund-plugin-react",
    "version": "1.0.69",
    "description": "This is an Obsidian Plugin for Sekund (https://sekund.io)",
    "main": "main.js",
    "scripts": {
        "prettier-format": "prettier --config .prettierrc.js *.tsx --write",
        "lint": "eslint . --ext .ts,.tsx",
        "dev": "rollup --config rollup.config.js -w",
        "build": "export environment=production && rollup --config rollup.config.js && terser main.js > release/main.js && postcss global.css -o release/styles.css",
        "build:css": "export environment=development && postcss global.css -o styles.css",
        "build:snippets": "export environment=development && postcss global-snippets.css -o tw-utils.css",
        "storybook": "start-storybook -s public -p 6006",
        "build-storybook": "build-storybook -s public",
        "deploy-storybook": "storybook-to-ghpages",
        "labels": "poeditor pull && rm -rf src/locales && mv tmp/locales src"
    },
    "keywords": [],
    "author": "",
    "license": "MIT",
    "dependencies": {
        "@emotion/react": "^11.7.1",
        "@emotion/styled": "^11.6.0",
        "@headlessui/react": "^1.4.1",
        "@heroicons/react": "^1.0.4",
        "@inrupt/solid-client": "^1.23.3",
        "@inrupt/solid-client-authn-browser": "^1.12.3",
        "@inrupt/vocab-common-rdf": "^1.0.5",
        "@mui/material": "^5.1.1",
        "base64-arraybuffer": "^1.0.1",
        "bson-objectid": "^2.0.1",
        "emoji-mart": "^3.0.1",
        "filename-reserved-regex": "^3.0.0",
        "i18next": "^21.3.1",
        "is-var-name": "^2.0.0",
        "javascript-time-ago": "^2.3.9",
        "jest": "^27.3.1",
        "match-casing": "^2.0.0",
        "mime-db": "^1.52.0",
        "obsidian": "^0.15.9",
        "electron": "^13.6.6",
        "password-validator": "^5.2.1",
        "postcss-import": "^14.0.2",
        "posthog-js": "^1.25.2",
        "react": "^17.0.2",
        "react-dom": "^17.0.2",
        "react-i18next": "^11.12.0",
        "react-responsive-carousel": "^3.2.23",
        "react-time-ago": "^7.1.3",
        "realm-web": "^1.3.0",
        "rollup-plugin-polyfill": "^3.0.0",
        "s3-ls": "^3.0.0",
        "slugify": "^1.6.5",
        "strip-outer": "^2.0.0",
        "trim-repeated": "^2.0.0",
        "ts-debounce": "^4.0.0"
    },
    "devDependencies": {
        "@babel/core": "^7.15.8",
        "@babel/standalone": "^7.14.0",
        "@etchteam/storybook-addon-css-variables-theme": "^1.0.2",
        "@rollup/plugin-commonjs": "^18.0.0",
        "@rollup/plugin-json": "^4.1.0",
        "@rollup/plugin-node-resolve": "^11.2.1",
        "@rollup/plugin-typescript": "^8.2.1",
        "@storybook/addon-actions": "^6.3.12",
        "@storybook/addon-essentials": "^6.3.12",
        "@storybook/addon-links": "^6.3.12",
        "@storybook/react": "^6.3.12",
        "@storybook/storybook-deployer": "^2.8.10",
        "@types/babel__core": "^7.1.12",
        "@types/emoji-mart": "^3.0.9",
        "@types/jest": "^27.0.3",
        "@types/mime-db": "^1.43.1",
        "@types/node": "^14.14.37",
        "@types/react": "^17.0.4",
        "@types/react-dom": "^17.0.3",
        "@types/styled-components": "^5.1.9",
        "@typescript-eslint/eslint-plugin": "^4.25.0",
        "@typescript-eslint/parser": "^4.25.0",
        "autoprefixer": "^10.3.7",
        "babel-loader": "^8.2.2",
        "eslint": "^7.27.0",
        "eslint-config-prettier": "^8.3.0",
        "eslint-plugin-prettier": "^3.4.0",
        "eslint-plugin-react": "^7.23.2",
        "i18next-browser-languagedetector": "^6.1.2",
        "postcss": "^8.3.11",
        "postcss-cli": "^9.0.1",
        "postcss-nested": "^5.0.6",
        "rollup": "^2.32.1",
        "rollup-plugin-babel": "^4.4.0",
        "rollup-plugin-copy": "^3.4.0",
        "rollup-plugin-import-css": "^2.0.1",
        "rollup-plugin-polyfill-node": "^0.6.2",
        "rollup-plugin-postcss": "^4.0.1",
        "rollup-plugin-terser": "^7.0.2",
        "sass": "^1.34.0",
        "storybook-addon-i18next": "^1.3.0",
        "storybook-dark-mode": "^1.0.8",
        "tailwindcss": "^2.2.16",
        "terser": "^5.9.0",
        "ts-node": "^10.4.0",
        "tslib": "^2.2.0",
        "typescript": "^4.3.2",
        "typescript-eslint": "^0.0.1-alpha.0"
    },
    "overrides": {
        "n3": {
            "readable-stream": "3.6.0"
        }
    }
}

rollup.config.js:

import commonjs from "@rollup/plugin-commonjs";
import json from "@rollup/plugin-json";
import { nodeResolve } from "@rollup/plugin-node-resolve";
import typescript from "@rollup/plugin-typescript";
import nodePolyfills from "rollup-plugin-polyfill-node";
import postcss from "rollup-plugin-postcss";
const polyfill = require("rollup-plugin-polyfill");

const isProd = process.env.BUILD === "production";

const banner = `/*
THIS IS A GENERATED/BUNDLED FILE BY ROLLUP
if you want to view the source visit the plugins github repository
*/
`;

export default {
  input: "src/main.tsx",
  inlineDynamicImports: true,
  preferBuiltins: true,
  output: [
    {
      file: "main.js",
      sourcemap: "inline",
      format: "cjs",
      exports: "default",
      banner,
      compact: true,
    },
  ],
  external: ["obsidian", "fs", "os", "path"],
  plugins: [
    json(),
    postcss({
      config: {
        path: "./postcss.config.js",
      },
      extensions: [".css"],
      minimize: true,
      inject: {
        insertAt: "top",
      },
    }),
    nodeResolve({ browser: true }),
    commonjs(),
    nodePolyfills("path"),
    typescript({ sourceMap: true }),
  ],
};

The last part of the package.json (the readable-stream override) was suggested to me as a possible fix by @jeswr, but unfortunately that did not work.

[jeswr]

In lieu of suggestions from others is there a minimal repro you can provide?

[ckemmler]

Sure, although it will have to wait a little. I didn’t do it right away as I wanted raise the issue before going to work. Did I break the etiquette by mentioning your suggestion? Sorry if that’s the case.  Le mer. 21 déc. 2022 à 07:27, Jesse Wright @.***> a écrit :
In lieu of suggestions from others is there a minimal repro you can provide?

—Reply to this email directly, view it on GitHub, or unsubscribe.You are receiving this because you authored the thread.Message ID: @.***>

[ckemmler]

Here's the repro repro that you asked: https://github.com/ckemmler/solid-circular-dependencies

[jeswr]

No ettiquite problems; I've had a look - when building it seems like the circular dependency is just a warning and not an actual error.

The crash

at anonymous (duplexify.js:50:25)
at e. (app.js:1:1547485)
at app.js:1:235078
at Object.next (app.js:1:235183)

Is coming from this file (https://github.com/nodejs/readable-stream/blob/main/lib/internal/streams/duplexify.js) so I think the warning listed is not relevant to your actual problem.

I tried to do some testing but I don't use obsidian so it is hard to test in that environment since I don't know how to add custom plugins to it; you might want to try polyfilling that module with node-streams?

Happy to try and do a bit more of a dive if you can point me how to test the bundle in obsidian.

[ckemmler]

Yes I can see that my problems stem from some deeper issues. Thank you