现在绝大多数的浏览器都不支持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. Cocos2d-X中的粒子

    Cocos2d-x引擎提供了强大的type=cocos2d-x&url=/doc/cocos-docs-master/manual/framework/native/v3/particle-s ...

  2. C++字符串操作二

    #include <iostream> #include <assert.h> using namespace std; //模拟实现strcmp函数. bool my_str ...

  3. BUCK电路工作原理

    Buck电路,也称呼为DC_DC Buck型降压开关电源电路,这种电路结构实际应用也是很多的,电路拓扑结构看下图: 电路中,Q1是开关管,D1是续流二极管,L1就是问题中提到的这个电感器.C1就是问题 ...

  4. Spring Cloud(十):服务网关zuul(转)

    前面的文章我们介绍了,Eureka用于服务的注册于发现,Feign支持服务的调用以及均衡负载,Hystrix处理服务的熔断防止故障扩散,Spring Cloud Config服务集群配置中心,似乎一个 ...

  5. 基于bootstrap的纯静态网站目录

    一.博客页面 二.登陆页面 三.信息采集 四.管理后台 五.网站汇总(基于上边四个功能) 因为样式统一采用bootstrap的样式,所以不做介绍 样式导入可以将bootstrap下载至本地(有自动补齐 ...

  6. eclipse的快捷键(常用)

    1. Ctrl+O 显示类中方法和属性的大纲,能快速定位类的方法和属性,在查找Bug时非常有用. 2. Ctrl+M 窗口最大化和还原,用户在窗口中进行操作时,总会觉得当前窗口小(尤其在编写代码时), ...

  7. MySQL 启动报错:File ./mysql-bin.index not found (Errcode: 13)

    Linux下安装初始化完MySQL数据库之后,使用mysqld_safe启动mysql数据库,如下发现,启动失败 [root@SVNServer bin]# ./mysqld_safe –user=m ...

  8. php 获取当前页面url路径

    #测试网址: http://localhost/blog/testurl.php?id=5 //获取域名或主机地址 echo $_SERVER['HTTP_HOST'].""; # ...

  9. vmware workstation14永久激活密钥

    vmware workstation14永久激活密钥分享: CG54H-D8D0H-H8DHY-C6X7X-N2KG6 ZC3WK-AFXEK-488JP-A7MQX-XL8YF AC5XK-0ZD4 ...

  10. FFmpeg Basics阅读笔记1:介绍

    Multimedia handling with a fast audio and video encoder 作者:Frantisek Korbel 网址:http://ffmpeg.tv/ FFm ...