Cloudflare DevelopersCD
Cloudflare Developers•2y ago
sirhype

Cannot find module with vite + react + typescript + yarn build

I'm going crazy trying to figure out the reasoning I'm getting 

src/App.tsx(1,53): error TS2307: Cannot find module 'react-router-dom' or its corresponding type declarations.


along with a billion other Cannot find module errors with my new Vite project. It's a vite + react + typescript project that's almost directly out of the box. When I've done this with other projects it worked, so I'm confused where I might be going wrong. Anyone seen this before?
Build command is yarn build, 
dist
 is the output directory. Versions are yarn@3.6.3, nodejs@18.17.1

tsconfig.json
{
  "compilerOptions": {
    "target": "ES2020",
    "useDefineForClassFields": true,
    "lib": ["ES2020", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "skipLibCheck": true,

    /* Bundler mode */
    "moduleResolution": "bundler",
    "allowImportingTsExtensions": true,
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react-jsx",

    /* Linting */
    "strict": true,
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "noFallthroughCasesInSwitch": true
  },
  "include": ["src"],
  "references": [{ "path": "./tsconfig.node.json" }]
}


.eslint.cjs

module.exports = {
  root: true,
  env: { browser: true, es2020: true },
  extends: [
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended-type-checked",
    "plugin:react-hooks/recommended",
    "plugin:react/recommended",
    "plugin:react/jsx-runtime",
  ],
  ignorePatterns: ["dist", ".eslintrc.cjs"],
  parser: "@typescript-eslint/parser",
  parserOptions: {
    ecmaVersion: "latest",
    sourceType: "module",
    project: ["./tsconfig.json", "./tsconfig.node.json"],
    tsconfigRootDir: __dirname,
  },
  plugins: ["react-refresh"],
  rules: {
    "react-refresh/only-export-components": [
      "warn",
      { allowConstantExport: true },
    ],
  },
};
Was this page helpful?