09月15, 2017

模块笔记

近期不得不提的前端圈大事,就是chrome61支持了module,node8.5.0也支持了module。

简单写两个demo演示一下。

chrome61的demo:

<script type="module">
    import Util, { XX, addText } from './utils.js';
    console.dir(Util);
    console.log(XX);
    addText(456);
</script>
// utils.js
export default {
    a: 1
}

export const XX = 1;

export function addText(str) {
    console.log(str);
}

效果截图:

alt

需要注意的是:访问不能是file协议,不然会跨域。

我个人觉得用户如果是XP电脑,那么就没办法了,因为XP上的chrome版本最高只能是48。。


node8.5的demo

// lib.mjs
export function add(x, y) {
    return x + y;
}
// main.mjs
import {add} from './lib.mjs';

console.log('Result: '+add(2, 3));

运行效果:

alt

这里我用了n,因为我不想把全局的node变成8.5.0,毕竟不是LTS。

需要注意的是文件的后缀名必须是mjs,然后在运行的时候需要加入--experimental-modules,就如同当年的async await,在node7下面运行要加--harmony-async-await是一样的。

更多的资料请查看:Node.js正式支持ES模块

最后吐个嘈,这个后缀真心不喜欢。。。

PS:iphoneX出来了,看似和前端没什么交集,但是据说很多app在iphoneX下面样式显示是乱的,所以以后写移动端页面,还得考虑iphoneX。。我只想说:心好累。。

本文链接:www.my-fe.pub/post/module-note.html

-- EOF --

Comments

评论加载中...

注:如果长时间无法加载,请针对 disq.us | disquscdn.com | disqus.com 启用代理。