rehype-stringify 10.0.0 does not work according to documentation about rehype

[ChristianMurphy]

Error messages should communicate what is wrong, and ideally be clear and searchable.

There are a lot of possible different reasons an error could occur.
From recent issues alone:

1. no compiler has been added
2. an invalid custom compiler has been created
3. incompatible dependencies have been directly installed
4. incompatible dependencies have been transitively installed
5. etc

The error message should not be a full copy paste of the unified, remark, and npm docs to try to cover all these.
That would both blow up the bundle size, and nobody would read all that.

I'd lean towards keeping the message as is.

[ianwremmel]

The "Other" runtime I'm using is Node 18. That wasn't one of the available options.

[ChristianMurphy]

@ianwremmel the response is the same as the other issue you linked, updated your dependencies.
To be more specific, update all the remark, rehype, and unified dependencies.
They need to be updated together, the error you are seeing indicates you are using an older version of unified.
The latest work together fine, here is a sandbox showing them working https://stackblitz.com/edit/github-qcuuxf?file=package.json

[github-actions]

Hi! This was closed. Team: If this was fixed, please add phase/solved. Otherwise, please add one of the no/* labels.

[github-actions]

Hi! Thanks for reaching out! Because we treat issues as our backlog, we close issues that are questions since they don’t represent a task to be completed.

See our support docs for how and where to ask questions.

Thanks,
— bb

[github-actions]

Hi team! It seems this post is a duplicate, but hasn’t been marked as such. Please post a comment w/ Duplicate of #123(no final .) to do so. See GH docs for more info.

Thanks,
— bb

[ianwremmel]

@ChristianMurphy I don't think that's it. I don't have any relevant out-of-date dependencies.

> npm outdated
Package      Current   Wanted  Latest  Location                  Depended by
@types/node  18.18.6  18.18.6  20.8.8  node_modules/@types/node  com.ianwremmel
bootstrap      5.1.3    5.3.2   5.3.2  node_modules/bootstrap    com.ianwremmel
chromatic      7.4.0    7.5.0   7.5.0  node_modules/chromatic    com.ianwremmel

{
  "name": "ianwremmel.com",
  "description": "Personal website of Ian W. Remmel",
  "version": "2.0.0",
  "author": "Ian Remmel <[email protected]>",
  "keywords": [],
  "license": "MIT",
  "scripts": {
    "prebuild": "npm-run-all --parallel build:styles build:graphql",
    "build": "remix build",
    "build:graphql": "graphql-codegen --config codegen.yml --require dotenv/config",
    "build:styles": "sass --load-path . app/styles/index.scss app/root.css",
    "postbuild:graphql": "npm run eslint -- --fix ./__generated__",
    "build-storybook": "storybook build",
    "chromatic": "chromatic --exit-zero-on-changes",
    "dev": "npm-run-all --continue-on-error --parallel dev:*",
    "dev:css": "npm run build:styles -- --watch",
    "dev:remix": "remix dev",
    "eslint": "eslint ${ESLINT_FORMAT_OPTIONS:-} --ignore-path .gitignore ",
    "lint": "npm-run-all --continue-on-error --parallel lint:*",
    "lint:changelog": "commitlint --from origin/main --to HEAD",
    "prelint:es": "mkdirp reports/style",
    "lint:es": "npm run --silent eslint -- .",
    "prelint:types": "mkdirp reports/style",
    "lint:types": "bash -c \"tsc $TSC_OPTIONS\"",
    "prepare": "husky install",
    "storybook": "storybook dev -p 6006",
    "test": "./scripts/storybook-test-runner"
  },
  "type": "module",
  "devDependencies": {
    "@commitlint/cli": "^18.0.0",
    "@commitlint/config-conventional": "^18.0.0",
    "@graphql-codegen/cli": "^5.0.0",
    "@graphql-codegen/introspection": "^4.0.0",
    "@graphql-codegen/schema-ast": "^4.0.0",
    "@graphql-codegen/typescript": "^4.0.1",
    "@graphql-codegen/typescript-operations": "^4.0.1",
    "@graphql-codegen/typescript-urql": "^4.0.0",
    "@graphql-eslint/eslint-plugin": "^3.20.1",
    "@ianwremmel/eslint-plugin-ianwremmel": "^6.2.2",
    "@remix-run/dev": "^2.1.0",
    "@remix-run/eslint-config": "^2.1.0",
    "@storybook/addon-a11y": "^7.5.1",
    "@storybook/addon-essentials": "^7.5.1",
    "@storybook/react": "^7.5.1",
    "@storybook/react-vite": "^7.5.1",
    "@storybook/test-runner": "^0.13.0",
    "@storybook/testing-library": "^0.2.2",
    "@types/node": "^18.18.5",
    "@types/react": "^18.2.31",
    "@types/react-dom": "^18.2.14",
    "@typescript-eslint/eslint-plugin": "^6.9.0",
    "@typescript-eslint/parser": "^6.9.0",
    "axe-playwright": "^1.2.3",
    "chromatic": "^7.4.0",
    "dotenv": "^16.3.1",
    "eslint": "^8.52.0",
    "eslint-config-prettier": "^9.0.0",
    "eslint-plugin-babel": "^5.3.1",
    "eslint-plugin-eslint-comments": "^3.2.0",
    "eslint-plugin-import": "^2.29.0",
    "eslint-plugin-jsx-a11y": "^6.7.1",
    "eslint-plugin-markdown": "^3.0.1",
    "eslint-plugin-prettier": "^5.0.1",
    "eslint-plugin-react": "^7.33.2",
    "eslint-plugin-react-hooks": "^4.6.0",
    "eslint-plugin-storybook": "^0.6.15",
    "husky": "^8.0.3",
    "lint-staged": "^15.0.2",
    "markdown-toc": "^1.2.0",
    "mkdirp": "^3.0.1",
    "npm-run-all": "^4.1.5",
    "prettier": "^3.0.3",
    "sass": "^1.69.4",
    "storybook": "^7.5.1",
    "typescript": "^5.2.2"
  },
  "private": true,
  "lint-staged": {
    "*.js": "npm run eslint -- ",
    "*.ts": "npm run eslint -- ",
    "*.tsx": "npm run eslint -- "
  },
  "husky": {
    "hooks": {
      "commit-msg": "commitlint -e",
      "pre-commit": "lint-staged"
    }
  },
  "engines": {
    "node": "^18",
    "npm": ">=9"
  },
  "sideEffects": false,
  "overrides": {
    "react-element-to-jsx-string": "^15"
  },
  "dependencies": {
    "@remix-run/node": "^2.1.0",
    "@remix-run/react": "^2.1.0",
    "@remix-run/serve": "^2.1.0",
    "@urql/core": "^4.1.4",
    "bootstrap": "^5.1.3",
    "classnames": "^2.3.2",
    "graphql": "^16.8.1",
    "isbot": "^3.7.0",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "rehype-stringify": "^10.0.0",
    "remark-gfm": "^4.0.0"
  }
}

[ChristianMurphy]

@ianwremmel again see the sandbox showing it working.
Your issue is that you have not specified all of your unified, remark, and rehype dependencies directly in your own package.json.
Which means they are coming in as transitive dependencies of something else.

npm outdated only lists outdated direct dependencies, you can, and do, have outdated transitive dependencies.

[ianwremmel]

ah, i see. usually my linters tell me when deps are missing. I'll have to look into why it let me import remark-gfm, remark-parse, remark-rehype, and unified without a warning. It might be worth improving the error message on .process() to suggest this might outdated or completely missing dependencies might be the issue.

[wooorm]

TypeError: Cannot process without Compiler

Your unified is not on the latest.
It’s not in your dependencies.
Make sure to install the dependencies you use.