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 ...
随机推荐
- Python+Selenium框架-unittest执行脚本方法之addTest
本文开始介绍如何通过unittest来管理和执行测试用例,这一篇介绍unittest下addTest()方法来加载测试用例到测试套件中去.为了演示效果,我在前面文章的脚本基础上,新建了一个测试脚本,这 ...
- kubernetes管理之使用yq工具截取属性
系列目录 前面我们讲解过使用go-template或者jsonpath格式(kubectl get 资源 --output go-tempalte(或jsonpath))来截取属性的值,并且我们比较了 ...
- 下载与安装---tensorflow on linux
http://wiki.jikexueyuan.com/project/tensorflow-zh/get_started/os_setup.html 你可以使用我们提供的 Pip, Docker, ...
- 加载jsp页面报#{} is not allowed in template text
问题是在引进jQueryUI时遇到 解决方法: 在page指令添加: deferredSyntaxAllowedAsLiteral="true" 例如:&l ...
- 通过Pojo对象 field 属性加注解实现格式校验,极大的降低代码量
近期做一个接口.接受外系统的报文,通过XStream转换成java对象以后.须要对当中的字段做格式校验. 要求例如以下: 传统的方式是硬编码校验.可是对于field非常多的情况.代码量暴增.easy出 ...
- python 修饰符(转载)
首先一个修饰符的实例: #!/usr/bin/env python def run(fn): def do_hello(): print "begin..." fn() print ...
- javascript 中 "undefined" 与 "is not defined" 分析
var var1; console.log( typeof var0);//print "undefined",主要看下面对var0单独的输出 console.log( typ ...
- python中的类的成员变量以及property函数
1 python类的各种变量 1.1 全局变量 在类外定义的变量. 1.2 类变量 定义在类里面,所有的函数外面的变量.这个变量只有一份,是所有的对象共有的.在类外用“类.”来引用. 1.3 实例变量 ...
- bluebird-api简介及demo
var Promise = require("bluebird"); var fs = require("fs"); //方法Promise化 var read ...
- windows下使用DOS命令删除大文件
首先进入DOS命令窗口: 1.进入到将要删除的目录: 执行命令: rmdir /s/q 文件夹名称 2.删除指定文件: 进入文件的目录下,找到要删除的文件名称+扩展名:例如111.jpg执行命令: d ...