ESLint errors prevent new app from being generated

[twnaing]

I am having the problem with following messages

yarn run v1.22.10
$ npm run -- lint:js --fix && npm run -- lint:css --fix

> lint:js
> stale-dep && eslint 'app/{components,frontend,javascript}/**/*.{js,jsx}' --fix

Oops! Something went wrong! :(

ESLint: 8.43.0

Error: Cannot find module 'word-wrap'
Require stack:
- /Users/twnaing/Area-51/rails-templates-m2/node_modules/optionator/lib/help.js
- /Users/twnaing/Area-51/rails-templates-m2/node_modules/optionator/lib/index.js
- /Users/twnaing/Area-51/rails-templates-m2/node_modules/eslint/lib/options.js
- /Users/twnaing/Area-51/rails-templates-m2/node_modules/eslint/lib/cli.js
- /Users/twnaing/Area-51/rails-templates-m2/node_modules/eslint/bin/eslint.js
    at Module._resolveFilename (node:internal/modules/cjs/loader:1070:15)
    at Module._load (node:internal/modules/cjs/loader:923:27)
    at Module.require (node:internal/modules/cjs/loader:1137:19)
    at require (node:internal/modules/helpers:121:18)
    at Object.<anonymous> (/Users/twnaing/Area-51/rails-templates-m2/node_modules/optionator/lib/help.js:6:14)
    at Object.<anonymous> (/Users/twnaing/Area-51/rails-templates-m2/node_modules/optionator/lib/help.js:260:4)
    at Module._compile (node:internal/modules/cjs/loader:1255:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1309:10)
    at Module.load (node:internal/modules/cjs/loader:1113:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

I have nodes 20.2.0, yarn 1.22.10 and the package.json has this.

{
  "private": "true",
  "scripts": {
    "fix": "npm run -- lint:js --fix && npm run -- lint:css --fix",
    "lint": "npm run lint:js && npm run lint:css",
    "lint:js": "stale-dep && eslint 'app/{components,frontend,javascript}/**/*.{js,jsx}'",
    "lint:css": "stale-dep && stylelint 'app/{components,frontend,assets/stylesheets}/**/*.{css,scss}'",
    "postinstall": "stale-dep -u"
  },
  "dependencies": {
    "eslint": "^8.43.0",
    "eslint-config-prettier": "^8.8.0",
    "eslint-plugin-prettier": "^4.2.1",
    "postcss": "^8.4.24",
    "prettier": "^2.8.8",
    "stale-dep": "^0.6.0",
    "stylelint": "^15.9.0",
    "stylelint-config-recommended-scss": "^12.0.0",
    "stylelint-config-standard": "^33.0.0",
    "stylelint-declaration-strict-value": "^1.9.2",
    "stylelint-prettier": "^3.0.0",
    "stylelint-scss": "^5.0.1"
  }
}

[mattbrictson]

@twnaing I think you hit a momentary bug in the npm ecosystem. Details here: https://github.com/eslint/eslint/issues/17317

Sounds like if you upgrade your packages (yarn upgrade, then yarn install), that should fix it.

[mattbrictson]

Let me know if you have any other issues with this.

[twnaing]

The issue is that the error occurred during the rails new. So the yarn upgrade and yarn install finished successfully, the new project still not at correct state (i.e. yarn start says error command "start" not found).

Should I also specify minimal yarn version? I use asdf to fix my versions.

[mattbrictson]

@twnaing I think you will need to delete the generated app directory and then start over by running rails new again. Does that work?

[twnaing]

These are the steps I took

1. create folder first, cd into the folder
2. set versions using asdf (ruby, Postgres, nodejs, yarn) in the project folder
3. run

$ rails new . \
    -d postgresql \
    -m https://raw.githubusercontent.com/mattbrictson/rails-template/main/template.rb

4. error occurs

[mattbrictson]

@twnaing sorry you are running into these problems. It seems like the last couple weeks have been a perfect storm of dependency conflicts in the ESlint ecosystem.

You didn't post the latest error message that you are seeing, so I can only take a guess. But based on what I am seeing, I suspect you are hitting this error:

Oops! Something went wrong! :(

ESLint: 8.44.0

TypeError: prettier.resolveConfig.sync is not a function
Occurred while linting app/javascript/application.js:2
Rule: "prettier/prettier"

This is due to the fact that Prettier 3.0 was just released a few days ago, and is causing the eslint-plugin-prettier package to break. You can see the discussion here: https://github.com/prettier/eslint-plugin-prettier/issues/562 .

The rails-template project is susceptible to these breakages because when you run rails new, the newest versions of its dependencies are fetched. In this case this included Prettier 3.0.

Hopefully eslint-plugin-prettier will release a new version that is compatible with Prettier 3.0. In the meantime I will adjust rails-template to use an alpha version of eslint-plugin-prettier that should work around the problem. See PR #47.

If I guessed incorrectly and TypeError: prettier.resolveConfig.sync is not a function is not the error you are seeing, please post the details of the error so that I can help you troubleshoot.