Builds Don't Work with Node v17 Release

[ralfisalhon]

In Node v17:

Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './lib/tokenize' is not defined by "exports" in /tmp/workspace/node_modules/postcss-safe-parser/node_modules/postcss/package.json

In earlier versions of Node, this was just a deprecation warning:

(node:3713) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution of the package at /tmp/workspace/node_modules/postcss-safe-parser/node_modules/postcss/package.json.
Update this package.json to use a subpath pattern like "./*".

[ai]

Try to update postcss. We fixed exports in postcss a few releases ago. Maybe the issue happened because of the old postcss.

[ralfisalhon]

This version of postcss is a react-scripts dependency and not something we should manually update. I'm worried that other people will run into this issue unintentionally

[ai]

Do you use postcss 7?

Can you show PostCSS versions from npm ls?

[RedHairring]

Bump, having the same issue and our website is down in production till there is a fix

[kanto2113]

Same issue here. Started about 2 hours ago when I tried to re-deploy my react website.

[ai]

@RedHairring @kanto2113 what PostCSS version do you use? Check npm ls.

[kanto2113]

@ai npm ls doesn't list PostCSS. The react-scripts npm module has the following as dependencies.

"postcss-flexbugs-fixes": "4.2.1",
"postcss-loader": "3.0.0",
"postcss-normalize": "8.0.1",
"postcss-preset-env": "6.7.0",
"postcss-safe-parser": "5.0.2" 

[ai]

@kanto2113 call npm ls in the terminal inside your project. Put the output to https://gist.github.com and post the result here.

[kanto2113]

@ai https://gist.github.com/kanto2113/bb7bfc17d49e8c31c4395f8a54622ec6

[ai]

@kanto2113 seems like you are using PostCSS 7, which is not supported anymore because PostCSS 8 was released around 2 years ago.

Create React App has system problem with maintaince. As I know, PostCSS 8 migration was still not release.

I do not really like to fixing my old releases because of CRA maintainers (it is not fair that I am working for them). But if somebody sends a well-tested PR to v7 branch, I can release it. Just start from reading the docs, it is easy to break system for other environments (for instance, * can’t be used, we need to manually listed all possible files as we did in main).

[dantman]

I do not really like to fixing my old releases because of CRA maintainers (it is not fair that I am working for them). But if somebody sends a well-tested PR to v7 branch, I can release it.

Unfortunately there's no point to that. react-scripts@4.0.3 has postcss-safe-parser pinned to 5.0.2 exactly. So even if make a new patch release it won't be installed.

It looks like CRA has already updated PostCSS to v8 and also removed postcss-safe-parser as part of the WebPack 5 update. However of course they haven't released any of the work done on CRA since Feb so we're stuck with this issue.

[heymike777]

Is there any fix for this?

[ai]

@Timashov nope. Only eject the configs and avoid using CRA in the future.

[experimatt]

Ugh, I'm in the same boat. npm ls output: https://gist.github.com/experimatt/56661550572ccfcfcf03ebc3c7dfc976

[ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './lib/tokenize' is not defined by "exports" in node_modules/postcss-safe-parser/node_modules/postcss/package.json

I do not really like to fixing my old releases because of CRA maintainers (it is not fair that I am working for them).

@ai: you have my sympathy. I really appreciate all the time, energy, and hard work you put into maintaining this and other packages. I'm donating to support your work now: https://opencollective.com/postcss/contribute

[ai]

@dantman

Unfortunately there's no point to that. react-scripts@4.0.3 has postcss-safe-parser pinned to 5.0.2 exactly. So even if make a new patch release it won't be installed.

The fix can be applied to postcss 7.x. Does CRA pinned postcss?

[dantman]

The fix can be applied to postcss 7.x. Does CRA pinned postcss?

Technically CRA does not pin PostCSS. They pin the following:

    "postcss-flexbugs-fixes": "4.2.1",
    "postcss-loader": "3.0.0",
    "postcss-normalize": "8.0.1",
    "postcss-preset-env": "6.7.0",
    "postcss-safe-parser": "5.0.2",

And PostCSS comes in indirectly:

+-- postcss-flexbugs-fixes@4.2.1
| `-- postcss@7.0.39
+-- postcss-loader@3.0.0
| `-- postcss@7.0.39 deduped
+-- postcss-normalize@8.0.1
| +-- postcss-browser-comments@3.0.0
| | `-- postcss@7.0.39 deduped
| `-- postcss@7.0.39 deduped
+-- postcss-preset-env@6.7.0
| +-- (a bunch of dependencies, each with)
| | `-- postcss@7.0.39 deduped
| `-- postcss@7.0.39 deduped
`-- postcss-safe-parser@5.0.2
  `-- postcss@8.3.11

And postcss-preset-env does appear to use postcss: ^7.0.17 so fixing it there could work.

Though I will note that postcss-safe-parser@5.0.2 uses postcss: ^8.1.0. For a number of pre-existing projects this means our package-lock actually has a postcss before 8.2.11 (when the bug was fixed). And I don't know if any way of telling node to update a deep package list this, short of deleting the entire lockfile. Given node's resolution algorithm I suspect this may be the real issue. And even if the 7.x packages turn out also be an issue, for most of us the issue will remain even after a normal npm package install and update due to our lockfiles.

[cojack]

Is there any fix for this?

yes, @Timashov downgrade your node version to 16

[spykard]

Still occuring

[artginzburg]

Same issue here. Currently bypassing it by downgrading to Node LTS (16).

The thing is, the project I'm talking about cannot even be safely updated to a newer version, because it was ejected from CRA.

New apps built with CRA work fine on Node 18 though.

[byteshiva]

Failing for Node v17.5.0

Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './lib/tokenize' is not defined by "exports" in /home/xyz/sample/node_modules/postcss-safe-parser/node_modules/postcss/package.json
    at new NodeError (node:internal/errors:371:5)
    at throwExportsNotFound (node:internal/modules/esm/resolve:429:9)
    at packageExportsResolve (node:internal/modules/esm/resolve:705:3)
    at resolveExports (node:internal/modules/cjs/loader:482:36)
    at Function.Module._findPath (node:internal/modules/cjs/loader:522:31)
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:919:27)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:999:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/home/xyz/sample/node_modules/postcss-safe-parser/lib/safe-parser.js:1:17) {
  code: 'ERR_PACKAGE_PATH_NOT_EXPORTED'
}

[byteshiva]

Failing for Node v17.5.0

Error [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './lib/tokenize' is not defined by "exports" in /home/xyz/sample/node_modules/postcss-safe-parser/node_modules/postcss/package.json
    at new NodeError (node:internal/errors:371:5)
    at throwExportsNotFound (node:internal/modules/esm/resolve:429:9)
    at packageExportsResolve (node:internal/modules/esm/resolve:705:3)
    at resolveExports (node:internal/modules/cjs/loader:482:36)
    at Function.Module._findPath (node:internal/modules/cjs/loader:522:31)
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:919:27)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:999:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/home/xyz/sample/node_modules/postcss-safe-parser/lib/safe-parser.js:1:17) {
  code: 'ERR_PACKAGE_PATH_NOT_EXPORTED'
}

The below fix worked for me.

Update postcss on v17.5.0

npm install  postcss   

[cosmicknox]

npm install postcss

this worked for me thanks

[xanderjames1910]

I had the same issue and as many of you say, it's a problem with react-scripts and postcss because of React version.

I fixed it in my React app by removing node_modules folder and yarn.lock file, then I updated my React version and also my react-dom dependency with:

yarn add react@latest react-dom@latest

Then I ran yarn so my node_modules get installed again, which fixed my issue.

I hope this helps some of you.

This worked for me because it's a small React App. You should probably verify if other dependencies are compatible with the latest React version (now 18.2.0)