mjs

We are JavaScripters で発表した .mjs の話です。

Transcript

1. .mjs 2018/04/24 We are JavaScripters!! 
 @ Recruit Technologies
2. Twitter: @yosuke_furukawa Github: yosuke-furukawa
3. Node.js v10 Release (maybe tomorrow)
4. Node.js v10 
 Notable Changes • for-await-of in Stream experimental support • ESModules experimental support • private/public class fields experimental support • fs/promises
5. DEMO
6. DEMO import fs from 'fs/promises'; import util from 'util'; async function main() { try { const content = await fs.readFile(process.argv[2]) console.log(content.toString()) } catch(e) { console.error(e.toString()); } } main();
7. file name is … foo.mjs
8. ʊʊਓਓਓʊʊ ʼɹ.mjs !!!ɹʻ ʉʉY^Y^Yʉʉ
9. Yes, we have long discussion about ESM.
10. We need ".mjs".
11. Why?
12. Module !== Script
13. Module [ "strict", "top level scope", "reserved await" ] Script [ "non strict", "global scope", ]
14. We need to detect which mode on load file.
15. if file.lastIndexOf(".mjs") { Module } else { Script }
16. Simple and Faster
17. We do not use ".js" ???? (´ɾωɾʆ)
18. No, 2 reasons.
19. Use loader option.
20. DEMO
21. DEMO const builtins = Module.builtinModules; const URL = url.URL; const baseURL = new URL('file://'); baseURL.pathname = `${process.cwd()}/`; export function resolve(specifier, parentModuleURL = baseURL, defaultResolve) { if (builtins.includes(specifier)) { return { url: specifier, format: 'builtin' }; } const resolved = new url.URL(specifier, parentModuleURL); const ext = path.extname(resolved.pathname); return { url: resolved.href, format: 'esm' }; }
22. DEMO $ node —experimental-modules —loader loader.mjs file.js // file.js
 import fs from 'fs'; import util from 'util'; const readFile = util.promisify(fs.readFile); async function main() { try { const content = await readFile(process.argv[2]) console.log(content.toString()) } catch(e) { console.error(e.toString()); } } main();
23. mode detection on flag `—mode` , package.json see: https://gist.github.com/ceejbot/b49f8789b2ab6b09548ccb72813a1054 
 https://docs.google.com/presentation/d/ 1xK1ana_TIxfAHX33CYVHFnJsV0If_YirLtRBBga9cv0/edit#slide=id.p
24. You just use ".js" if you don’t need to use ESM.
25. You would be better to use ".mjs", if you need ESM on Node.js v9-10.
26. You would be better to wait the conclusion, if you want to use ES Modules in the future.
27. ऄ଍ (da-soku) +
28. Filename Extensions YOMO-YAMA
29. Long long time ago… Brendan Eich saids …
30. )PX
    EP
    XF
    UIJOL
    FT
    FT
    pMF
    FYUFOTJPOT
    UP
    EFUFDU
    WFSTJPOT // sorry no reference… I cannot find link 8F
    OFFE
    UP
    DIBOHF
    pMFOBNF
    FYUFOTJPOT
    UP
    VQHSBEF
    
    UIBU
    JT
    OJHIUNBSF
    ʜ
31. *
    EJTMJLF
    NPEFT
    8IP
    EPFTOU
    #VU
    UIJT
    TPVOET
    MJLF
    UIF
    7FSTJPOJOH
    JT
    BO
    BOUJQBUUFSO
    TIJCCPMFUI
    *WF
    IFBSE
    SFDFOUMZ
    SF
    8FC4PDLFUT
    *U
    EPFT
    OPU
    SFqFDU
    SFBMJUZ https://esdiscuss.org/topic/no-more-modes 3FDFOUMZ
    *
    NFU
    XJUI
    UIF
    (PPHMF
    7
    UFBN
    GPS
    UXP
    GVMM
    EBZT
    0OF
    NFTTBHF
    UIBU
    DBNF
    UISPVHI
    MPVE
    BOE
    DMFBS
    UIBU
    *
    TBJE
    *
    XPVME
    SFMBZ
    UP
    UIF
    MJTU
    JT
    QMFBTF
    OP
    NPSF
    NPEFT
32. Web does not have
 version/mode.
33. All we need is feature detection.
34. Detectable Feature // Feature Detection if (!Array.isArray) {} if (!String.prototype.trimStart) {}
35. un-detectable feature (on runtime) class A {} import / export #foo // syntax
36. Modern JavaScript is difficult to detect features.
37. Module JavaScript is JavaScript 2.0
38. JavaScript is not so easy, We are JavaScripters, Every JSers would be better to enjoy chaos.
39. Enjoy JS Chaos :)
40. Thanks