how to publish an UMD module package to NPM All in One

how to publish an UMD module package to NPM All in One

如何发布一个 UMD 模块包到 npm 上

npm

https://github.com/xgqfrms/umd-npm-package

https://www.npmjs.com/package/umd-npm-package

# yarn
$ uarn add npm-umd
# npm
$ npm i npm-umd

UMD

// closure 闭包

https://github.com/umdjs/umd

// IIFE

UMD === amd + cjs + iife

amd – Asynchronous Module Definition, used with module loaders like RequireJS

cjs – CommonJS, suitable for Node and other bundlers (alias: commonjs)

es – Keep the bundle as an ES module file, suitable for other bundlers and inclusion as a <script type=module> tag in modern browsers (alias: esm, module)

iife – A self-executing function, suitable for inclusion as a <script> tag. (If you want to create a bundle for your application, you probably want to use this.). "iife" stands for "immediately-invoked Function Expression"

umd – Universal Module Definition, works as amd, cjs and iife all in one

system – Native format of the SystemJS loader (alias: systemjs)

https://rollupjs.org/guide/en/#outputformat

ESM

es module

<script type="module" src="./es-module.mjs">

<script type="module" src="./es-module.js">

CJS

AMD

CMD

SystemJS

Dynamic ES module loader

<script src="system.js"></script>
<script type="systemjs-module" src="/js/main.js"></script>
<script type="systemjs-module" src="import:name-of-module"></script>

<script src="system.js"></script>
<script type="systemjs-importmap">
{
  "imports": {
    "lodash": "https://unpkg.com/lodash@4.17.10/lodash.js"
  }
}
</script>
<!-- 
Alternatively:
<script type="systemjs-importmap" src="path/to/map.json" crossorigin="anonymous"></script>
-->
<script type="systemjs-module" src="/js/main.js"></script>

System.import('/js/main.js')

System.register([], function () { ... });

System.register('name', [], function () { ... });

https://github.com/systemjs/systemjs

https://www.npmjs.com/package/systemjs

refs

https://www.cnblogs.com/xgqfrms/tag/UMD/

https://medium.com/@kelin2025/so-you-wanna-use-es6-modules-714f48b3a953

CJS, AMD, UMD, and ESM

https://dev.to/iggredible/what-the-heck-are-cjs-amd-umd-and-esm-ikm

https://addyosmani.com/writing-modular-js/

https://www.davidbcalhoun.com/2014/what-is-amd-commonjs-and-umd/

https://juejin.im/post/6844903927104667662

https://juejin.im/post/6844903978333896718

https://segmentfault.com/a/1190000018243783

https://zhuanlan.zhihu.com/p/19569085

https://blog.csdn.net/muer_123/article/details/90044091

https://blog.csdn.net/xinyuan_java/article/details/106147877

https://github.com/xiaokeqi/i-learned/issues/49

---

---

©xgqfrms 2012-2020

www.cnblogs.com 发布文章使用：只允许注册用户才可以访问！

---