美文网首页
ES6快速学习(六)使用模块

ES6快速学习(六)使用模块

作者: slTrust | 来源:发表于2017-12-08 14:19 被阅读0次

ES6自带模块化 但是浏览器还不支持

  • 使用webpack 前面已有文章总结了,这里就不说了
  • 还可以使用Google公司的Traceur转码器,也可以将ES6代码转为ES5代码。必须在网页头部加载Traceur库文件。

注意!!注意!! 要运行在服务器环境
服务器是什么?你不会我没法详细和你说

两个工具

  • wamp 搭建服务器 自行百度
  • cnpm install http-server 前提是安装了node 同时设置了淘宝镜像
  • 然后在你当前目录打开命令行 输入 http-server -c-1
    在显示的端口号访问就行了 你还要问细节怎么办?
    那你就回答我 “回”字为什么有四种写法

新建mod.js

let a=12;
let b=5;
export default {
    a:a,
    b:b
}

index.html文件

<script src="https://google.github.io/traceur-compiler/bin/traceur.js"></script>
<script src="https://google.github.io/traceur-compiler/bin/BrowserSystem.js"></script>
<script src="https://google.github.io/traceur-compiler/src/bootstrap.js"></script>
<script type="module">
    import mod from './mod.js';  
    console.log(mod.a)    // 打印12
</script>

相关文章

  • ES6快速学习(六)使用模块

    ES6自带模块化 但是浏览器还不支持 使用webpack 前面已有文章总结了,这里就不说了 还可以使用Googl...

  • export default和export的使用方式

    ES6 基本 在ES6中,也通过规范的形式,规定了ES6中如何导入和导出模块 导入模块:使用import模块名称f...

  • 从iife(立即执行函数)到es6的module

    一、使用es6之前(也没用其他模块管理插件) a.js文件如下: b.js文件需要使用模块a时: 二、使用es6之...

  • ES6的export default+export和node的m

    // 在 ES6中,也通过 规范的形式,规定了 ES6 中如何 导入 和 导出 模块// ES6中导入模块,使用...

  • export default,exports.default,m

    ES6语法如下导出模块使用export + 变量/函数引入模块使用import(不过以上nodejs 8.4.0暂...

  • ES6模块的循环加载

    ES6 处理“循环加载”与 CommonJS 有本质的不同。ES6 模块是动态引用,如果使用import从一个模块...

  • webpack2 配置分享

    任务型学习.. 活动页配置 先放一份配置(适合简单的活动页)...可以使用ES6,使用模块,使用sass,还有po...

  • 【一起来烧脑】入门ES6体系

    为什么要学习ES6掌握ES3、ES5、ES6的联系和区别 快速入门ES6 学会快速构建ES6的编译环境 学习ES6...

  • 前端技能点

    使用过webpack2.0+ 掌握ES6语法 ES6和CommonJS的模块化规范 知道npm和babel的使用 ...

  • webpack学习

    ES6模块化的语法学习 a、默认导出,使用export default 默认导出的成员b、默认导入,import ...

网友评论

      本文标题:ES6快速学习(六)使用模块

      本文链接:https://www.haomeiwen.com/subject/kfeeixtx.html