ES6语法的模块导入导出(import/export)功能,我们在使用它的时候,可能会报错:

SyntaxError: Unexpected token import
语法错误:此处不应该出现import

我遇到的情况是import语法不识别导致的。在这里,有两种方法可以解决。

1: 使用node的v8及之后的版本

因为,node需要v8.x之后的版本才支持ECMAScript Modules 和 imort 语法

目前,node稳定版本是v8.11.2

可以使用nvm来安装管理查看多个node版本

可以使用--experimental-modules实验模块标志来启用加载ECMAScript Modules的特性。

而且作为ES模块加载的文件名,必须以.mjs后缀结尾

node --experimental-modules my-app.mjs

此种方法,在输出的时候会提示:

(node:16208) ExperimentalWarning: The ESM module loader is experimental.

表示是个实验模块,到时候可能会修改。

例子:https://github.com/weiqinl/demo/tree/master/01-es6-import

2: 使用babel,通用方法

浏览器直接支持import程度比较低,所以需要babel来将import转换为es5语法。

安装

通过 npm:

npm install --save-dev babel-preset-env babel-cli

或者通过 yarn:

yarn add babel-preset-env --dev

使用

没有选项的默认行为将运行所有transform(与 babel-preset-latest 相同)。

新建一个.babelrc文件,并在里面写入:

{
"presets": ["env"]
}

执行

babel-node index.js

我的例子: https://github.com/weiqinl/demo/tree/master/01-es6-import

babel官方给出的一个例子:https://github.com/babel/example-node-server

2018-10-18 更新

无法识别import,换一种想法,也可以说是低版本浏览器不支持。现在babel已经更新到版本7了,我们用最新的babel来实现。

该问题的babel7的解决方案:https://www.cnblogs.com/weiqinl/p/9773048.html

参考: https://github.com/nodejs/help/issues/53

解决问题SyntaxError: Unexpected token import的更多相关文章

  1. Node.js启动服务报错SyntaxError: Unexpected token import

    启动服务报错如下: Last login: Wed Nov :: on ttys000 localhost:~ sipeng$ cd /Users/sipeng/Desktop/彭思/2017年学习/ ...

  2. ES6编译问题SyntaxError: Unexpected token import

    遇到SyntaxError: Unexpected token import 如何解决 ??? 究其原因是node es6问题这还不够,因为我们没有去配置babel,所以我们需要在.babelrc去做 ...

  3. 使用nuxt.js官方脚手架构建项目时ES6编译问题SyntaxError: Unexpected token import

    用nuxt集成koa2做vue后台,官方自带脚手架搭建的koa2仍是ES5语法,在构建koa2时默认的nodemon是没有使用babel编译的, 所以首先需要在启动命令后加上--exec babel- ...

  4. 关于Uncaught SyntaxError: Unexpected token o in JSON at position 1,chrome持续报错的相关解析

    今天跟大家分享我前两天遇见的一个BUG,说出来很难受,因为这个BUG花了我一个多小时去找原因,后来莫名其妙的故障消失了,强迫症犯了的我,居然花了2个多小时去故意再制造这个BUG,只想弄明白WHY??? ...

  5. json格式字符串用Uncaught SyntaxError: Unexpected token ' Uncaught SyntaxError: Unexpected number

    Unexpected number(index)的错误用的json字符串如 var jsonStr = "{1:'北京note备注信息',2:'上海note备注信息',3:'广东note备注 ...

  6. Appium+python自动化54-appium-doctor报错已解决(SyntaxError: Unexpected token ...)

    前言 由于新版的appium desktop版本是不带appium-doctor这个包的,所以想用appium-desktop检查环境的话需要另外的安装了,在安装的时候小编又遇到了一个坑 报错信息:S ...

  7. 【shiro】使用shiro搭建的项目,页面引用js,报错:Uncaught SyntaxError: Unexpected token <

    使用shiro搭建项目过程中,总是出现登录页面 登录第一次有效果,登陆第二次出现302状态码,第三次又有效果,第四次又没有效果的局面. 因此,采用ajax提交页面登录的用户名和密码,但是在引用js的过 ...

  8. 【转】Vue项目报错:Uncaught SyntaxError: Unexpected token <

    这篇文章主要介绍了Vue项目报错:Uncaught SyntaxError: Unexpected token <,在引入第三方依赖的 JS 文件时,遇到的一个问题,小编觉得挺不错的,现在分享给 ...

  9. uncaught syntaxerror unexpected token U JSON

    uncaught syntaxerror unexpected token U JSON The parameter for the JSON.parse may be returning nothi ...

随机推荐

  1. 爬虫综合大作业——网易云音乐爬虫 & 数据可视化分析

    作业要求来自于https://edu.cnblogs.com/campus/gzcc/GZCC-16SE2/homework/3075 爬虫综合大作业 选择一个热点或者你感兴趣的主题. 选择爬取的对象 ...

  2. Spring项目使用Junit4测试配置

    我们经常要写junit测试,在不启动整个web项目的情况下,测试自己的service实现或者是dao实现,我们来充分利用下junit4的强大功能. 1.junit4的测试类 import java.u ...

  3. 【游戏开发】基于VS2017的OpenGL开发环境搭建

    一.简介 最近,马三买了两本有关于“计算机图形学”的书籍,准备在工作之余鼓捣鼓捣图形学和OpenGL编程,提升自己的价值(奔着学完能涨一波工资去的).俗话说得好,“工欲善其事,必先利其器”.想学习图形 ...

  4. charles抓包https设置

    写在前面 https抓包的实现 (一)首先,电脑得装个证书 (二)然后,移动设备上安装证书 (三)最后,Charles添加SSL Proxying 写在前面 开发时,面对各种接口数据,绝大多数时间都会 ...

  5. CentOS7自定义系统服务示例

    CentOS7的服务systemctl脚本存放在:/usr/lib/systemd/,有系统(system)和用户(user)之分,需要开机不登陆就能运行的程序,存在系统服务里,即:/usr/lib/ ...

  6. torchvision 作用

    1. 提供主流的model,和常用数据集 2. 对 torch.utils.data.Dataset进行扩充,针对不同类别图像放入不同文件夹的数据进行读取, torchvision.datasets. ...

  7. mac charles手机抓包详细教程

    1.官方下载charles 2.查看电脑IP地址 3.Proxy>Proxy Settings>勾选 Enable transparent HTTP proxying  (记住端口号 88 ...

  8. Scrapy+Scrapy-redis+Scrapyd+Gerapy 分布式爬虫框架整合

    简介:给正在学习的小伙伴们分享一下自己的感悟,如有理解不正确的地方,望指出,感谢~ 首先介绍一下这个标题吧~ 1. Scrapy:是一个基于Twisted的异步IO框架,有了这个框架,我们就不需要等待 ...

  9. [经验交流] 试用基于 influxdb+kapacitor 的监控系统

    2017年10月16日: 使用中发现kapacitor的ui过于简单,不能满足实际工作需要,现已切换到grafana --------- 两个月前试用了基于 elasticsearch + xpack ...

  10. Spring Cloud 2-Bus 消息总线(九)

    Spring Cloud  Bus  1.服务端配置 pom.xml application.yml 2.客户端配置 pom.xml application.yml Controller.java 3 ...