I need help structuring a new TypeScript project built on a MERN stack. I used CRA for the client, so I opted to have separate tsconfig files -- one for client (auto-generated by CRA) and one for server (extends node12 tsconfig). However, I'm trying to setup eslint and prettier globally so that the lint/style rules are uniform across the codebase. CRA adds an eslint config that extends react-app, which is fine, but I'd like to still have my global rules. I have written my eslintrc.json file and am happy with it, so I placed it in the project root directory. I figured I would install eslint, prettier, etc. in the project root, then when I run eslint globally, it would lint the server code with the global rules and the client code with the global rules and the react-scripts rules.

However, react-scripts complains that I've installed a newer version of eslint in a parent directory. I can either ignore that rule or use the same version as react-scripts, but it seems like react-scripts is going to run eslint on its own when I run npm start, regardless of if I have a global config. What should I do? Is there a better way to structure the app?

  • 0
    Not exactly sure where the problem lies...
    What command is in the "start" script in your package.json (I assume:the one in your project root).
    If you have multiple package.json, check all "start" commands within those files. Maybe you have delete the script enties in your child directories for linting and only use one npm script from your root package.json
Add Comment