es6 import 报错
现在绝大多数的浏览器都不支持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 报错的更多相关文章
- .vue文件在webstorm中es6语法报错解决方法
1 语法支持es6设置 Preferences > Languages & Frameworks > JavaScript 把 Javascript Language versio ...
- webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token punc ((); 或者 Unexpected token: operator (>)
webpack 打包压缩 ES6文件报错UglifyJs + Unexpected token punc ((); 或者 Unexpected token: operator (>) 解决方案 ...
- webstorm中.vue报错(es6语法报错)-转
1.webstorm中es6语法报错,解决方法: 打开 Settings => Languages & Frameworks => Javascript把 Javascript L ...
- 关于使用spring版本4.1.6注解@Import报错
记录一下遇到的错误 org.springframework.beans.factory.parsing.BeanDefinitionParsingException: 使用环境:spring 4.1. ...
- matplotlib.pyplot import报错: ValueError: _getfullpathname: embedded null character in path
Environment: Windows 10, Anaconda 3.6 matplotlib 2.0 import matplotlib.pyplot 报错: ValueError: _getfu ...
- Eclipse + Pydev开发Python时import报错解决方法
一. 原文链接:http://blog.csdn.net/lhanchao/article/details/51306626 用eclipse +PyDev开发python时, ...
- vue +ts 在router的路由中import报错的解决方案
在router.ts中引入.vue文件,会提示打不到module,但是编译可能成功,运行也不报错 找了好久,发现了这个答案 https://segmentfault.com/a/11900000167 ...
- ImportError: DLL load failed: 找不到指定的模块;ImportError: numpy.core.multiarray failed to import 报错解决
python程序运行出错,出错的两行主要信息如下: ImportError: DLL load failed: 找不到指定的模块 ImportError: numpy.core.multiarray ...
- Windows下通过pip安装PyTorch 0.4.0 import报错
问题:通过pip安装PyTorch 0.4.0成功,但是import时报错. import torch File "D:\Python\Python36\lib\site-packages ...
随机推荐
- C/C++程序到内存分配(转)
一.一个由C/C++编译到程序占用的内存分为以下几个部分: 1.栈区(stack)——由编译器自动分配释放,在不需要的时候自动清除.用于存放函数的参数.局部变量等.操作方式类似数据结构中的栈(后进先出 ...
- Mysql多线程性能测试工具sysbench 安装、使用和测试
From:http://www.cnblogs.com/zhoujinyi/archive/2013/04/19/3029134.html 摘要: sysbench是一个开源的.模块化的.跨 ...
- 【转载】C#中的==、Equal、ReferenceEqual
1. ReferenceEquals, == , Equals Equals , == , ReferenceEquals都可以用于判断两个对象的个体是不是相等. a) ReferenceEquals ...
- MYSQL主从不同步延迟原理分析及解决方案
1. MySQL数据库主从同步延迟原理.要说延时原理,得从mysql的数据库主从复制原理说起,mysql的主从复制都是单线程的操作,主库对所有DDL和DML产生binlog,binlog是顺序写,所以 ...
- kubernetes对象之cronjob
系列目录 类似于Linux的Cron模块,CronJob用来运行定时性任务,或者周期性.重复性任务.注意CronJob启动的是kubernetes中的Job,不是ReplicaSet.DaemonSe ...
- mysql 中alter语句中change跟modify的区别
mysql 中alter语句中change和modify的区别可以使用CHANGE old_col_name column_definition子句对列进行重命名.重命名时,需给定旧的和新的列名称和列 ...
- 集群服务器状态命令------rs.status()各个字段的含义
可根据rs.status() 查询集群服务器状态.字段解释: self 这个信息出现在执行rs.status()函数的成员信息中 stateStr用户描述服务器状态的字符串.有SECONDARY,PR ...
- 九度OJ 1089:数字反转 (数字反转)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:3059 解决:1678 题目描述: 12翻一下是21,34翻一下是43,12+34是46,46翻一下是64,现在又任意两个正整数,问他们两个 ...
- 九度OJ 1088:剩下的树 (线段树)
时间限制:1 秒 内存限制:32 兆 特殊判题:否 提交:5791 解决:2649 题目描述: 有一个长度为整数L(1<=L<=10000)的马路,可以想象成数轴上长度为L的一个线段,起点 ...
- 远程访问Linux的常见方式
访问方式 不加密文字界面:telnet.rsh 加密文字界面:SSH 图形界面:Xdmcp.RDP.VNC SSH SSH用来取代finger.R shell(rlogin.rcp.rsh).teln ...