现在绝大多数的浏览器都不支持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. select中分割多组option

    <optgroup style="color:gray; font-style:normal" label="——雪佛兰(五菱)——"></o ...

  2. pyqt5 学习总结

    关于基类 一般的文件都会基于QWidget,QtWidgets.QMainWindow 或QDialog,like this class Example(QWidget): QWidget类是所有用户 ...

  3. 自己动手写CPU之第七阶段(5)——流水线暂停机制的设计与实现

    将陆续上传本人写的新书<自己动手写CPU>,今天是第28篇.我尽量每周四篇 China-pub的预售地址例如以下(有文件夹.内容简单介绍.前言): http://product.china ...

  4. how to run a continuous background task on OpenShift

    https://stackoverflow.com/questions/27152438/best-way-to-run-rails-background-jobs-with-openshift ht ...

  5. webstorm 设置IP 访问 手机测试效果

    http://www.cnblogs.com/gulei/p/5126383.html 前端开发中,经常需要将做好的页面给其他同事预览或手机测试,之前一直用的第三方本地服务器usbwebserver, ...

  6. cocos2dx-3.1 接入多盟广告sdk+Android (2)

    上篇,把基本工作做完了,接下来,在C++下加入代码. 1.打开win32下的project,加入一个类.DomobAd.代码例如以下, <pre name="code" cl ...

  7. Android自动折行TextView Group

    package com.test.testview; import java.util.ArrayList; import android.content.Context; import androi ...

  8. windows下的txt格式转换成linux下的TXT

    存在的问题是 多出一个方框或者黑格子 主要是因为bash 不能忽略windows的问题 用sed 命令来处理,分别是windows转linux,linux转windows sed -e 's/.$// ...

  9. 第 2 章 第 2 题 找" 重数/漏数 "问题 位向量实现

    问题分析 输入:一个包含了4 300 000 000个32位整数的文件( 其中可能有重复出现的数字 ) 输出:一个在这个文件中重复出现过了的数字 约束:无 解答思路 第一章中,我们学习了如何用位向量进 ...

  10. 模式匹配之尺度空间---scale space

    转载:http://www.cnblogs.com/cfantaisie/archive/2011/06/14/2080917.html   主要步骤  1).尺度空间的生成:     2).检测尺度 ...