.js 와 .mjs

프로젝트를 진행하다가 생기던 문제였는데

This file is being treated as an ES module because it has a '.js' file extension and '/Users/Desktop/study/my-blog-next/package.json' contains "type": "module". To treat it as a CommonJS script, rename it to use the '.cjs' file extension.

이러한 오류가 발생하여, package.json에 타입을 명시해서 해결을 하려했다.

또다른 오류로는

Cannot use import statement outside a module

해당 에러는 mjs파일로 변경해서 해결했다.

근데 js랑 mjs 차이가 뭔지 궁금해져서 따로 결과를 찾아보았다.

Node.js의 모듈 시스템은 commonjs를 사용했었는데,
ECMAscript 모듈 시스템이 표준이 되었고, 이에 mjs파일로 module system을 추가 지원하게 되었다.

그래서 패키지에서 type을 module 혹은 commonjs에서 선택하여, 명시 해줄 수 있게 되었다.

// package.json
{
  "name": "portrait",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "type": "module", // 'commonjs' , 'module'
    ...
}