tsc throws TS2307 Cannot find module for a local file

Question

I ve got a simple example project using TypeScript  https   github com unindented ts-webpack-example  Running tsc -p    with tsc version 1 8 10  throws the following   app index ts 1 21   error TS2307  Cannot find module  components counter   components button index ts 2 22   error TS2307  Cannot find module  shared backbone base view   components button index ts 3 25   error TS2307  Cannot find module  shared backbone with default render   components counter index ts 2 22   error TS2307  Cannot find module  shared backbone base view   components counter index ts 3 25   error TS2307  Cannot find module  shared backbone with default render   components counter index ts 4 27   error TS2307  Cannot find module  shared backbone with subviews   components counter index ts 5 20   error TS2307  Cannot find module  components button     It complains about all imports of local files  like the following   import Counter from  components counter     If I change it to a relative path it works  but I don t want to  as it makes my life more difficult when moving files around   import Counter from     components counter     The vscode codebase does not use relative paths  but everything works fine for them  so I must be missing something in my project  https   github com Microsoft vscode blob 0e81224179fbb8f6fda18ca7362d8500a263cfef src vs languages typescript common typescript ts L7-L14  You can check out my GitHub repo  but in case it helps here s the tsconfig json file I m using        compilerOptions          target    es5        module    commonjs        noImplicitAny   false       removeComments   false       preserveConstEnums   true       sourceMap   true       outDir    dist          exclude          dist        node modules          Funny thing is  building the project through webpack using ts-loader works fine  so I m guessing it s just a configuration issue

User · Answer

In my case         app UseWebpackDevMiddleware new WebpackDevMiddlewareOptions                                   HotModuleReplacement   true                     i commented it in startup cs

User · Answer

vladima replied to this issue on GitHub   The way the compiler resolves modules is controlled by moduleResolution option that can be either node or classic  more details and differences can be found here   If this setting is omitted the compiler treats this setting to be node if module is commonjs and classic - otherwise  In your case if you want classic module resolution strategy to be used with commonjs modules - you need to set it explicitly by using        quot compilerOptions quot              quot moduleResolution quot    quot node quot

User · Answer

In VS2019  the project property page  TypeScript Build tab has a setting  dropdown  for  Module System    When I changed that from  ES2015  to CommonJS  then VS2019 IDE stopped complaining that it could find neither  axios nor redux-thunk  TS2307    tsconfig json        compilerOptions          allowJs   true       baseUrl    src        forceConsistentCasingInFileNames   true       jsx    react        lib            es6          dom          es2015 promise              module    esnext        moduleResolution    node        noImplicitAny   true       noImplicitReturns   true       noImplicitThis   true       noUnusedLocals   true       outDir    build dist        rootDir    src        sourceMap   true       strictNullChecks   true       suppressImplicitAnyIndexErrors   true       esModuleInterop   true       allowSyntheticDefaultImports   true       target    es5        skipLibCheck   true       strict   true       resolveJsonModule   true       isolatedModules   true       noEmit   true         exclude          build        scripts        acceptance-tests        webpack        jest        src setupTests ts        node modules        obj             spec ts          include          src        src      ts         types      d ts        node modules axios        node modules redux-thunk

User · Answer

I was in trouble to import an Enum in typescript     error TS2307  Cannot find module      What I did to make it work was migrate the enum to another file and make this change   export enum MyEnum      VALUE    MY VALUE      to   export enum MyEnum      VALUE   1

User · Answer

The vscode codebase does not use relative paths  but everything works fine for them   Really depends on your module loader  If you are using systemjs with baseurl then it would work  VSCode uses its own custom module loader  based on an old version of requirejs     Recommendation  Use relative paths as that is what commonjs supports  If you move files around you will get a typescript compile time error  a good thing  so you will be better off than a great majority of pure js projects out there  on npm

User · Answer

Don t use  import UserController from  quot api xxxx quot  Should be  import UserController from  quot   api xxxx quot

User · Answer

If use webstorm  press Ctrl Alt S and bring up the settings window  Languages amp Frameworks TypeScript  enable  use tsconfig json  option

User · Answer

In some cases you just need to update the include array       quot compilerOptions quot          quot target quot    quot es6 quot        quot module quot    quot commonjs quot        quot moduleResolution quot    quot node quot        quot outDir quot    quot dist quot        quot sourceMap quot   false       quot baseUrl quot    quot   quot        quot paths quot            quot     quot     quot src   quot                 quot include quot     quot src      ts quot    quot tests      ts quot       quot exclude quot     quot node modules quot    quot  vscode quot

[typescript] tsc throws `TS2307: Cannot find module` for a local file

Examples related to typescript