V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐关注
Meteor
JSLint - a JavaScript code quality tool
jsFiddle
D3.js
WebStorm
推荐书目
JavaScript 权威指南第 5 版
Closure: The Definitive Guide
keroppi
V2EX  ›  JavaScript

一个组件怎么构建成多个方式引用的文件?

  •  
  •   keroppi · 2020-04-15 21:42:06 +08:00 · 1717 次点击
    这是一个创建于 1685 天前的主题,其中的信息可能已经有所发展或是发生改变。
    新人请教自己封装一个 JS 组件的时候,怎么在打包的时候生成使用 url 地址引用的文件、和在 npm 发布的包两个不同的文件?

    就好像 github 上又很多 JS 组件,即可 <script src='somefile.js'></script> 这样引入,也可以 npm i some-pack 这样的。

    ps:我这里只是指生成可以用 npm publish 发布的那个模块文件,并不是问怎么发布 NPM 包,另外用传统 URL 引入方式可能对浏览器兼容度不太一样,打包时有用到 babel 转换
    2 条回复    2020-04-17 16:45:46 +08:00
    sakitamFDD
        1
    sakitamFDD  
       2020-04-15 21:59:37 +08:00 via Android
    rollup 或者 webpack,构建目标生成三种~ esm 、commonjs 、umd,其实默认 umd 就支持 node 的 commonjs 模式和浏览器的直接引入
    jifengg
        2
    jifengg  
       2020-04-17 16:45:46 +08:00
    我以前自己写的时候用了一种可能不太好的方法:在代码里判断是否存在 window,是就说明是在 web 端,不是就说明是在服务端。然后根据是否 web 端来 import 和 export
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3400 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 23ms · UTC 12:19 · PVG 20:19 · LAX 04:19 · JFK 07:19
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.