javascriptnode.jstypescriptnuxt3.jsmjs

exports is not defined in ES module scope


I created nest js project as following.

nest new project-name

and imported following from nuxt3 which is of type module of node js with mjs file extension (type definition of import doesn't require to write mjs).

import { ViteBuildContext, ViteOptions, bundle } from '@nuxt/vite-builder-edge';

It gives me below error.

Uncaught Error Error [ERR_REQUIRE_ESM]: require() of ES Module c:\project\node_modules\@nuxt\vite-builder-edge\dist\index.mjs not supported. Instead change the require of c:\project\node_modules\@nuxt\vite-builder-edge\dist\index.mjs to a dynamic import() which is available in all CommonJS modules.

So I tried adding "type": "module" in package.json so now I am getting below error.

Uncaught ReferenceError ReferenceError: exports is not defined in ES module scope This file is being treated as an ES module because it has a '.js' file extension and 'c:\project\package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension. at <anonymous> (c:\project\dist\main.js:2:23)

How do I fix this? Error is related to typescript (or say compiled javascript) is unable to import mjs exports. What is solution to this?

{
  "compilerOptions": {
    "module": "commonjs",
    "declaration": true,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "target": "es2017",
    "sourceMap": true,
    "outDir": "./dist",
    "baseUrl": "./",
    "incremental": true,
    "skipLibCheck": true,
    "strictNullChecks": false,
    "noImplicitAny": false,
    "strictBindCallApply": false,
    "forceConsistentCasingInFileNames": false,
    "noFallthroughCasesInSwitch": false
  }
}

Solution

  • Updating tsconfig "module" and "target" to "ES6" (module is past, ES is future. Please use ES so that they can deprecate module) solved the issue.

    But after that, imports stopped working without extension.

    So I had to add ".js" in import even though they were ".ts" files.

    e.g. I had to import app.module.ts file as following (note extension).

    import { AppModule } from './app.module.js';