使用webpack+babel开发npm模块

栏目: JavaScript · 发布时间: 7年前

内容简介:开发npm包,推荐使用ES6书写,再用babel进行转码,将ES6转成ES5,开发体验好,效率高。一个典型的node工程目录解构,bin目录下存放程序入口,libs目录下存放逻辑源码,使用webpack进行模块构建,使用babel进行ES6转码,使用npm script管理脚本。

开发npm包,推荐使用ES6书写,再用babel进行转码,将ES6转成ES5,开发体验好,效率高。

使用webpack+babel开发npm模块

一个典型的node工程目录解构,bin目录下存放程序入口,libs目录下存放逻辑源码,使用webpack进行模块构建,使用babel进行ES6转码,使用npm script管理脚本。

创建node脚本入口

比如创建一个 cli.js 文件:

#!/uisr/bin/env node

console.log('your code goes here');
  1. 需要注意的是,第一行代码需要添加 片段标识符 (也叫hashbang),使用Node解释器执行该脚本。如果遇到权限问题,使用 sudo chmod +x file 添加可执行权限 。
  2. 其次,在 package.json 中,必须提供 bin 字段: "bin": "bin/cli" 相当于指定npm的入口。

使用commander处理命令参数问题

gituhub的README上写的很详细, https://github.com/tj/commander.js/blob/master/Readme_zh-CN.md

使用webpack+babel开发npm模块

调试过程

  1. 推荐使用 VS Code 开发node应用,不仅仅代码提示、导航方面做的好,最好用的一点是可以直接F5启动调试模式,可以打断点一行一行的调试node程序,前提是设置好程序入口。对于更加复杂的应用, 可以通过配置 .vscode/launch.json 进行高级配置。

  2. 在项目根目录下通过 npm link 可以将项目link到全局 node_modules 目录,这样就可以在任意目录下都可以使用自己的命令,英文名叫 symbolic link ,每次保存原文件会link也会立即生效, 不用再次运行 npm link 命令。

# 查看链接的位置
$ which your_command

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

即将到来的场景时代

即将到来的场景时代

罗伯特•斯考伯、谢尔•伊斯雷尔 / 赵乾坤 周宝曜 / 北京联合出版公司 / 2014-5-1 / 42

科技大神、全球科技创新领域最知名记者 罗伯特·斯考伯:“技术越了解你,就会为你提供越多好处!” 互联网的炒作点一个一个不停出现,大数据、3D打印、O2O等,无不宣扬要颠覆商业模式。但是,互联网进入移动时代,接下来到底会发生什么?移动互联网时代真正带来哪些改变?这具体会怎样影响我们每一个人的生活?商业真的会被颠覆?目前为止没有一本书给出答案。 《即将到来的场景时代》不是就一个炒作点大加谈......一起来看看 《即将到来的场景时代》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

HTML 编码/解码
HTML 编码/解码

HTML 编码/解码