现在绝大多数的浏览器都不支持ES6,所以使用es6时需要使用bebal把es6转化为es5,

项目目录:

demo1:单个js文件的转化

src文件下的 test1.js

const aa="this is test1";

console.log("this is from test1",aa);\

在项目根目录引入bebal文件

.babel

内容:

{

  presets:["es2015"]

}

安装babel-cli

cnpm i babel-cli -g

因为要转es6到es5所以还需要安装babel-preset-es2015

cnpm i babel-preset-es2015 --save-dev

转化test1.js

babel src --out-dir dist

(把src目录下的js文件转换成es5到dist文件下)

页面引入dist下的test1.js 运行不会报错

demo2:多个文件项目引入,并转化

src文件下:

test2.js

const bb="this is bb";

export {bb}

test3.js

import {bb} from 'test2.js'

console.log(bb);

转换 babel src --out-dir dist

页面引入dist文件下的test2.js test3.js

报错

由于我们通过node;来编译ES6成es5,node模块就是参照CommonJS的规范来的,而且现在的浏览器和node都不支持大部分的ES6

解决办法

可以通过webpack进行打包,把所有的依赖都合并为一个文件,同时使用babel进行转换,然后再引入html文件中就可以了

es6 import 报错的更多相关文章

  1. .vue文件在webstorm中es6语法报错解决方法

    1 语法支持es6设置 Preferences > Languages & Frameworks > JavaScript 把 Javascript Language versio ...

  2. webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token punc ((); 或者 Unexpected token: operator (>)

    webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token punc (();  或者 Unexpected token: operator (>) 解决方案 ...

  3. webstorm中.vue报错(es6语法报错)-转

    1.webstorm中es6语法报错,解决方法: 打开 Settings => Languages & Frameworks => Javascript把 Javascript L ...

  4. 关于使用spring版本4.1.6注解@Import报错

    记录一下遇到的错误 org.springframework.beans.factory.parsing.BeanDefinitionParsingException: 使用环境:spring 4.1. ...

  5. matplotlib.pyplot import报错: ValueError: _getfullpathname: embedded null character in path

    Environment: Windows 10, Anaconda 3.6 matplotlib 2.0 import matplotlib.pyplot 报错: ValueError: _getfu ...

  6. Eclipse + Pydev开发Python时import报错解决方法

    一.  原文链接:http://blog.csdn.net/lhanchao/article/details/51306626            用eclipse +PyDev开发python时, ...

  7. vue +ts 在router的路由中import报错的解决方案

    在router.ts中引入.vue文件,会提示打不到module,但是编译可能成功,运行也不报错 找了好久,发现了这个答案 https://segmentfault.com/a/11900000167 ...

  8. ImportError: DLL load failed: 找不到指定的模块;ImportError: numpy.core.multiarray failed to import 报错解决

    python程序运行出错,出错的两行主要信息如下: ImportError: DLL load failed: 找不到指定的模块 ImportError: numpy.core.multiarray ...

  9. Windows下通过pip安装PyTorch 0.4.0 import报错

    问题:通过pip安装PyTorch 0.4.0成功,但是import时报错. import torch  File "D:\Python\Python36\lib\site-packages ...

随机推荐

  1. visual c++ 2013进行MySQL编程(ODBC) -- (一) 套装安装

    最近写了有些技术类文章了,只因为最近研究多了些东西,有一些项目用到了,所以自己记录一下,怕自己忘记,如果有哪位同学有自己的见解,可以邮件或者回复,技术类的探讨,不管对否,都是欢迎的. 操作之前,必须安 ...

  2. h5调用手机照相机

    camera.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...

  3. HDU1532_Drainage Ditches(网络流/EK模板/Dinic模板(邻接矩阵/前向星))

    Drainage Ditches Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) ...

  4. mysql flush详解

    http://www.cnblogs.com/ggjucheng/archive/2012/11/07/2758021.html   cnblogs - FLUSH TABLES WITH READ ...

  5. Python+Selenium框架 ---一个类文件多个测试方法情况下测试固件的写法

    我们测试中,肯定需要,打开一个页面,然后测试这个页面的多个用例,才关闭这个页面,去测试其他页面,在unittest是有相关测试固件方法去支持这种行为.请看下面 # coding=utf-8 impor ...

  6. jsp 下拉框首字母定位可检索

    实现效果如图: 页面部分: (1)js中: (2)body中: JAVA代码部分: 控制器Controller中 写一个页面js中调用的方法: 引入jar包:

  7. sublime 快捷键 汇总--长期

    Ctrl+P 输入当前项目中的文件名,快速搜索文件 Ctrl+G 输入数字跳转到该行代码 Ctrl+R 输入关键字,查找文件中的函数名 Ctrl+: 输入关键字,查找文件中的变量名.属性名等 Ctrl ...

  8. ffmpeg mediacodec 硬解初探

    ffmpeg mediacodec 硬解初探 1编译: ffmpeg自3.1版本加入了android mediacodec硬解支持,解码器如图 硬件加速器如图(还不清楚硬件加速器的功能) 编译带h26 ...

  9. win10下rose2003安装与破解(图解)

    系统刷成了win10的,因为选择的是全新安装的方式,所以开发工具又得又一次安装了,rose尽管好用.但是安装破解还是有点麻烦,这里整理一下.备用,下回就不须要去网上搜索了. 安装文件下载地址:链接: ...

  10. Linux把查询结果写入到文本

    在Linux命令模式下,可以将查询结果写入文件.大概有两种方式,增量写入和覆盖写入. 增量写入: #iostat -m >> /tmp/iostat.txt 覆盖写入: #iostat - ...