Node/React App 返回“SyntaxError: Unexpected token import”错误
Posted
技术标签:
【中文标题】Node/React App 返回“SyntaxError: Unexpected token import”错误【英文标题】:Node/React App returning "SyntaxError: Unexpected token import" Error 【发布时间】:2018-11-29 00:59:35 【问题描述】:我是一个刚接触 Node 和 React 的新开发人员,所以对这个问题摸不着头脑。今天我用谷歌搜索了 5 个多小时,已经用尽了这里和 GitHub 上提出的每一个解决方案,但无法解决我的问题,所以转而提出一个新问题。
我正在使用 Heroku 部署 Node/React 应用程序,但我不断看到以下错误消息:
9:22:22 PM web.1 | /Users/Captain_Kirk/Desktop/StarterApp/index.js:1
9:22:22 PM web.1 | (function (exports, require, module, __filename, __dirname) import React, Component from 'react';
9:22:22 PM web.1 | ^^^^^^
9:22:22 PM web.1 | SyntaxError: Unexpected token import
9:22:22 PM web.1 | at new Script (vm.js:51:7)
9:22:22 PM web.1 | at createScript (vm.js:136:10)
9:22:22 PM web.1 | at Object.runInThisContext (vm.js:197:10)
9:22:22 PM web.1 | at Module._compile (module.js:613:28)
9:22:22 PM web.1 | at Object.Module._extensions..js (module.js:660:10)
9:22:22 PM web.1 | at Module.load (module.js:561:32)
9:22:22 PM web.1 | at tryModuleLoad (module.js:501:12)
9:22:22 PM web.1 | at Function.Module._load (module.js:493:3)
9:22:22 PM web.1 | at Function.Module.runMain (module.js:690:10)
9:22:22 PM web.1 | at startup (bootstrap_node.js:194:16)
9:22:22 PM web.1 Exited with exit code 1
这是我的 package.json 文件:
"name": "StarterApp",
"version": "1.0.0",
"description": "test app",
"engines":
"node": "9.8.0"
,
"main": "index.js",
"scripts":
"start": "node index.js",
"dev": "node server.js"
,
"author": "",
"license": "ISC",
"dependencies":
"fs-extra": "^5.0.0",
"ganache-cli": "^6.1.0",
"mocha": "^5.0.5",
"next": "^4.1.4",
"next-routes": "^1.4.1",
"npm": "^6.1.0",
"react": "^16.3.1",
"react-dom": "^16.3.1",
"semantic-ui-css": "^2.3.1",
"semantic-ui-react": "^0.79.1",
"solc": "^0.4.21",
"truffle-hdwallet-provider": "0.0.3",
"web3": "^1.0.0-beta.26",
"webpack-cli": "^2.0.13"
,
"devDependencies":
"babel-cli": "^6.26.0",
"babel-preset-env": "^1.7.0",
"webpack": "^3.12.0"
,
"directories":
"test": "test"
当我运行“npm install”时,我看到以下警告:
npm WARN deprecated babel-preset-es2015@6.24.1: ???? Thanks for using Babel: we recommend using babel-preset-env now: please read babeljs.io/env to update!
^ 我似乎已经有了正确的预设,所以不知道为什么会出现这个警告。
其他 npm 警告:
npm WARN deprecated nomnom@1.8.1: Package no longer supported. Contact support@npmjs.com for more info.
npm WARN ajv-keywords@3.2.0 requires a peer of ajv@^6.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN webpack-cli@2.0.13 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN kickstart@1.0.0 No repository field.
我在这里做错了什么?
【问题讨论】:
你认为SyntaxError: Unexpected token import
是什么意思?
@Nick 我认为这意味着它无法理解“导入”的含义,这可能是因为当前版本的 Node 不适用于 ES6 声明。想法?
是的,但是你有 webpack 和 babel 来处理这个问题,那么它们是如何配置的呢?
经过多次调试,我决定重新编写应用程序,然后它就可以工作了。这么奇怪。尴尬的是我无法调试它,不得不重新编写它:(
【参考方案1】:
由于您使用的是 React,因此建议您将“babel-preset-react”添加到您的开发依赖项中。
您可以在此处阅读有关该模块的更多信息:https://www.npmjs.com/package/babel-preset-react
【讨论】:
谢谢!听起来很疯狂,但我已经调试了几个小时,所以只是从头开始重新制作应用程序,这次它解决了问题。【参考方案2】:Node 不允许使用 Express 关键字 import
,而是使用 require
代替 import
。
希望它对你有用。
【讨论】:
以上是关于Node/React App 返回“SyntaxError: Unexpected token import”错误的主要内容,如果未能解决你的问题,请参考以下文章
从 Postgres 返回图像 url 到前端 - Node / React