구문 오류 : 모듈 외부에서 import 문을 사용할 수 없습니다

문제를 일으키는 ApolloServer 프로젝트가 있으므로 최신 Babel을 사용할 때 업데이트하고 문제가 발생할 수 있다고 생각했습니다. 내 "index.js"는 다음과 같습니다.

require('dotenv').config()
import {startServer} from './server'
startServer()

그리고 그것을 실행할 때 "SyntaxError : 모듈 외부에서 import 문을 사용할 수 없습니다"라는 오류가 발생합니다. 먼저 TPTB *에게 이것이 모듈 (성공하지 않음)임을 확신시키기 위해 노력했습니다. 그래서 "import"를 "require"로 변경했는데 이것이 효과가있었습니다.

그러나 이제 다른 파일에 약 24 개의 "가져 오기"가있어 동일한 오류가 발생합니다.

* 내 문제의 근본 원인은 문제에 대해 무엇이 불만인지 확실하지 않다는 것입니다. 나는 그것이 바벨 7 (Babel 6에서 왔고 사전 설정을 변경해야했기 때문에)이라고 가정했지만 100 % 확실하지 않습니다.

솔루션에서 찾은 대부분은 스트레이트 노드에 적용되지 않는 것 같습니다. 여기 이것처럼 :

"Uncaught SyntaxError : Unexpected identifier"를주는 ES6 모듈 가져 오기

"type = module"을 추가하여 해결되었지만 일반적으로 HTML에는 없습니다. 또한 프로젝트의 이전 사전 설정을 사용해 보았습니다.

"presets": ["es2015", "stage-2"],
"plugins": []

그러나 그것은 또 다른 오류를 발생시킵니다 : "오류 : 플러그인 / 사전 설정 파일은 객체를 내보낼 수 없으며 함수 만 내보낼 수 있습니다."

업데이트 : 다음은 내가 시작한 종속성입니다.

"dependencies": {
"@babel/polyfill": "^7.6.0",
"apollo-link-error": "^1.1.12",
"apollo-link-http": "^1.5.16",
"apollo-server": "^2.9.6",
"babel-preset-es2015": "^6.24.1",

2020 업데이트 (노드 13.2.0 이상)

최신 버전의 Node가 설치되어 있는지 확인하십시오. --experimental-modules플래그는 더 이상 필요하지 않습니다. 간단히 다음 중 하나를 수행하십시오 .

• "type": "module"가장 가까운 부모에 추가하십시오 package.json. 이를 통해 모든 파일 .js과 .mjs파일이 ES 모듈로 해석됩니다. .cjs확장명 을 사용하여 개별 파일을 CommonJS로 해석 할 수 있습니다 .

또는

• .mjs확장명을 가진 파일 이름을 명시 적으로 지정하십시오 . 와 같은 다른 모든 파일 .js은 CommonJS로 해석되며에 type정의되지 않은 경우 기본값 입니다 package.json.

공식 문서에 따르면 ( https://nodejs.org/api/esm.html#esm_code_import_code_statements ) :

import 문은 ES 모듈에서만 허용됩니다. CommonJS의 유사한 기능에 대해서는 import ()를 참조하십시오.

Node가 파일을 ES 모듈로 취급하게하려면 ( https://nodejs.org/api/esm.html#esm_enabling ) :

• package.json에 "type": "module"추가
• 노드 호출에 "--experimental-modules"플래그 추가

나는 같은 문제가 있었고 다음과 같이 수정했습니다 (노드 12.13.1 사용).

• .js 파일 확장명을 .mjs로 변경
• 앱을 실행할 때 --experimental-modules 플래그를 추가하십시오.
• 선택 사항 : package.json에 "type": "module"을 추가하십시오.

자세한 정보 : https://nodejs.org/api/esm.html

신생 Express API 프로젝트 에서이 문제가 발생했습니다.

문제가되는 서버 코드 src/server/server.js:

import express from 'express';
import {initialDonationItems, initialExpenditureItems} from "./DemoData";

const server = express();

server.get('/api/expenditures', (req, res) => {
  res.type('json');
  res.send(initialExpenditureItems);
});

server.get('/api/donations', (req, res) => {
  res.type('json');
  res.send(initialDonationItems);
});

server.listen(4242, () => console.log('Server is running...'));

내 의존성은 다음과 같습니다.

{
  "name": "contributor-api",
  "version": "0.0.1",
  "description": "A Node backend to provide storage services",
  "scripts": {
    "dev-server": "nodemon --exec babel-node src/server/server.js --ignore dist/",
    "test": "jest tests"
  },
  "license": "ISC",
  "dependencies": {
    "@babel/core": "^7.9.6",
    "@babel/node": "^7.8.7",
    "babel-loader": "^8.1.0",
    "express": "^4.17.1",
    "mysql2": "^2.1.0",
    "sequelize": "^5.21.7",
    "sequelize-cli": "^5.5.1"
  },
  "devDependencies": {
    "jest": "^25.5.4",
    "nodemon": "^2.0.3"
  }
}

그리고 여기에 오류를 던진 러너가 있습니다.

nodemon --exec babel-node src/server/server.js --ignore dist

비슷한 Express 프로젝트가 제대로 작동했기 때문에 실망 스러웠습니다.

솔루션은 먼저이 종속성을 추가했습니다.

npm install @babel/preset-env

그런 다음 babel.config.js프로젝트 루트에서 a 를 사용하여 연결하십시오 .

module.exports = {
  presets: ['@babel/preset-env'],
};

나는 이것이 왜 작동하는지 완전히 알지 못했지만 권위있는 출처 에서 복사 했으므로 기꺼이 그것을 고집합니다.

1. babel을 사용하기 시작했을 때도 같은 문제가 있었지만 나중에 해결책이있었습니다 ... 더 이상 문제가 없었습니다 ... 현재 Node v12.14.1, "@ babel / node" : "^ 7.8.4", 나는 babel-node와 nodemon을 사용하여 실행합니다 (node도 좋습니다.)
2. package.json : "start": "nodemon --exec babel-node server.js"debug ":"babel-node debug server.js "!! 참고 : server.js는 내 항목 파일입니다.
3. launch.json 디버깅 할 때 launch.json 파일 "runtimeExecutable"을 구성해야합니다. "$ {workspaceRoot} /node_modules/.bin/babel-node"!! 참고 : 구성에 runtimeExecutable을 추가하십시오.
4. 물론 babel-node에서는 일반적으로 babel.config.js / .babelrc 파일과 같은 다른 파일도 필요로하고 편집합니다.

내 솔루션은 다음과 같이 nodemon을 실행하는 동안 babel-node 경로를 포함하는 것입니다.

nodemon node_modules/.bin/babel-node index.js

package.json 스크립트에 다음과 같이 추가 할 수 있습니다.

debug: nodemon node_modules/.bin/babel-node index.js

참고 : 내 입력 파일은 index.js 이며 입력 파일로 대체 합니다 (많은 app.js / server.js).