我有一个ApolloServer项目，它给我带来了麻烦，所以我想我可能会更新它，但在使用最新的Babel时遇到了问题。我的index.js是:
require('dotenv').config()
import {startServer} from './server'
startServer()
当我运行它时，我得到了错误
SyntaxError: Cannot use import statement outside a module
首先，我试图说服TPTB*这是一个模块(没有成功)。所以我把“import”改成了“require”，这就成功了。
但现在我在其他文件中有大约24个“导入”给我同样的错误。
*我敢肯定我问题的根源是我甚至不知道抱怨的是什么。我有点假设它是巴别塔7(因为我来自巴别塔6，我不得不改变预设)，但我不是100%确定。
我发现的大多数解决方案似乎并不适用于直节点。比如这个:
ES6模块导入给出“未捕获SyntaxError:意外标识符”
说它是通过添加“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",
首先，我们将安装 @babel/cli、@babel/core 和 @babel/preset-env：
npm install --save-dev @babel/cli @babel/core @babel/preset-env
然后我们将创建一个.babelrc文件来配置Babel:
touch .babelrc
这将承载我们可能想要配置Babel的任何选项:
{
"presets": ["@babel/preset-env"]
}
随着Babel最近的变化，你需要在Node.js运行ES6之前编译它。
我们将在package.json文件中添加第一个脚本build。
"scripts": {
"build": "babel index.js -d dist"
}
然后我们将在package.json文件中添加开始脚本。
"scripts": {
"build": "babel index.js -d dist", // replace index.js with your filename
"start": "npm run build && node dist/index.js"
}
现在让我们启动服务器。
npm start
节点v14.16.0
对于那些尝试过。mjs的人来说:
Aviator@AW:/mnt/c/Users/Adrian/Desktop/Programming/nodejs_ex$ node just_js.mjs
file:///mnt/c/Users/Adrian/Desktop/Programming/nodejs_ex/just_js.mjs:3
import fetch from "node-fetch";
^^^^^
SyntaxError: Unexpected identifier
谁试过从"node-fetch"导入取回;
谁试过const fetch = require('node-fetch');
Aviator@AW:/mnt/c/Users/Adrian/Desktop/Programming/nodejs_ex$ node just_js.js
(node:4899) Warning: To load an ES module, set "type": "module" in the package.json or use the .mjs extension.
(Use `node --trace-warnings ...` to show where the warning was created)
/mnt/c/Users/Adrian/Desktop/Programming/nodejs_ex/just_js.js:3
import fetch from "node-fetch";
^^^^^^
SyntaxError: Cannot use import statement outside a module
那些尝试过"type": "module"来打包的人。Json，但继续看到错误，
{
"name": "test",
"version": "1.0.0",
"description": "to get fetch working",
"main": "just_js.js",
"type": "module",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "MIT"
}
我可以毫无问题地切换到axios。
从'axios'导入axios;<——置于文件顶部。
例子:
axios.get('https://www.w3schools.com/xml/note.xml').then(resp => {
console.log(resp.data);
});
JavaScript模块文件的mime类型错误
该问题的常见根源是“模块”类型JavaScript文件的mime类型不能被处理或交付这些文件的服务器、客户端或ECMAScript引擎识别为“模块”类型。
The problem is the developers of Module JavaScript files incorrectly associated Modules with a new ".mjs" (.js) extension, but then assigned it a MIME-type server type of "text/javascript". This means both .js and .mjs types are the same. In fact the new type for .js JavaScript files has also changed to "application/javascript", further confusing the issue. So Module JavaScript files are not being recognized by any of these systems, regardless of Node.js or Babel file processing systems in development.
主要的问题是，大多数服务器或客户端(现代HTML5浏览器)还不知道这种新的JavaScript“模块”子类型。换句话说，除了JavaScript类型，他们没有办法知道Module文件类型到底是什么!
你得到了你发布的响应，JavaScript引擎说它需要知道这个文件是否是Module类型的JavaScript文件。
The only solution, for server or client, is to change your server or browser to deliver a new Mime-type that trigger ES6 support of Module files, which have an .mjs extension. Right now, the only way to do that is to either create a HTTP content-type on the server of "module" for any file with a .mjs extension and change your file extension on module JavaScript files to ".mjs", or have an HTML script tag with type="module" added to any external <script> element you use that downloads your external .js JavaScript module file.
一旦你欺骗浏览器或JavaScript引擎接受新的Module文件类型，它们就会开始在你使用的JS引擎或Node.js系统中进行脚本杂技表演。
