Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

This module is declared with using 'export =', and can only be used with a default import when using the 'esModuleInterop' flag

Tags:

I'm trying to make a simple API using typescript and NodeJS but when I run my code I get this error

"This module is declared with using 'export =', and can only be used with a default import when using the 'esModuleInterop' flag."

This is my code: package.json

    {   "name": "API-Proyecto",   "version": "1.0.0",   "description": "",   "main": "index.js",   "scripts": {     "test": "echo \"Error: no test specified\" && exit 1"   },   "keywords": [],   "author": "",   "license": "ISC",   "dependencies": {     "cors": "^2.8.5",     "express": "^4.17.1",     "jsonwebtoken": "^8.5.1"   },   "devDependencies": {     "@types/cors": "^2.8.6",     "@types/express": "^4.17.6",     "nodemon": "^2.0.4"   } } 

Index.ts

    import express from 'express'; import { Request, Response }  from 'express'; import cors from 'cors';  const app = express();  app.use(express.urlencoded({extended: true})); app.use(express.json); app.use(cors({origin: true, credentials: true}));  app.get('/api/auth/testing', (req: Request, res: Response) =>{     res.status(200).json({         ok : true,         msg : 'hi from my method'     }); });  app.listen(3000, () => {console.log('Server running on 3000' )}); 

tsconfig.json

    {   "compilerOptions": {     "target": "es6",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */     "module": "commonjs",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */     "outDir": "./dist",                        /* Redirect output structure to the directory. */     "esModuleInterop": true,                  /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */   } } 
like image 958
Antonio Labra Avatar asked Jun 09 '20 00:06

Antonio Labra


People also ask

How do I fix the default can be imported using the esModuleInterop flag?

The error "Module can only be default-imported using esModuleInterop flag" occurs when we try to import a CommonJS module into an ES6 module. To solve the error, set the esModuleInterop option to true in your tsconfig. json file.

Does ts not have default export?

The "Module has no default export" error occurs when we try to import as default from a module that doesn't have a default export. To solve the error make sure the module has a named export and wrap the import in curly braces, e.g. import {myFunction} from './myModule' .

Should you use esModuleInterop?

We highly recommend applying it both to new and existing projects. esModuleInterop is also a recommended option to set in tsconfig. json and when one runs tsc --init it gets set to true automatically.


1 Answers

Your code is perfectly fine.

Fix

When you make changes to tsconfig, sometimes you need to restart your IDE or Code Editor 🌹

like image 60
basarat Avatar answered Sep 20 '22 11:09

basarat