节点/反应应用返回“ SyntaxError:意外的令牌导入”错误

时间:2018-06-20 01:31:16

标签: node.js reactjs babeljs nextjs

我是一个刚刚接触Node和React的新开发人员,所以我为这个问题挠头了。我今天在Google上搜索了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.

我在这里做错了什么?

2 个答案:

答案 0 :(得分:2)

由于您使用的是React,因此建议您在开发依赖项中添加“ babel-preset-react”。

您可以在此处了解有关该模块的更多信息:https://www.npmjs.com/package/babel-preset-react

答案 1 :(得分:1)

Node不允许使用Express关键字 import ,而是使用 require 代替import。< / p>

希望它可能对您有用。