功能需求:

  1用browserify把各种js打包成浏览器端的1个bundle.js,含有yml配置文件

约束:

1 yml配置文件不在当前工程里(现在还不知道放哪里,以后也会变),希望在打包时,用命令行参数的方式传入一个路径,形如

--config=D:/dev/kiev1941/overlay.yml
     2这个配置文件在client.js开头会require(),所以要打包进bundle.js
 
开始的破题思路是:
1 如何让browserify  cli 接收argv,解析yml文件地址
2 如何在client.js开头require(yml文件名)
第一轮搜索,读资料后发现
1可以变成,用代码的方式运行browserify bundle过程。而不是browserify命令行工具。
也就是说,命令行方式的打包是:
"browserify ./src/client.js -o ./static/bundle.js -t [ babelify --presets[env]]"

这种里面加命令行参数,和读取内容,之类的callback比较困难。

但是,完全可以写一个do_bundle.js文件:

const browserify = require('browserify');
//做cli参数解析,各种预处理工作
...
//打包过程代码,代替browserify命令行
browserify('./src/client.js')
.transform('babelify',{presets: ["@babel/preset-env"]})
.bundle()
.pipe(fs.createWriteStream("./static/bundle.js"));

然后这个js,所以可以直接在package.json里起1个node+命令行参数的运行任务:

"scripts": {
"build_browser": "node src/do_bundle.js --config=D:/dev/kiev1941/overlay.yml"
}

对于2 读取、解析yml不难,但如果要在client.js 里require(),但是

1如果cli传入的名字不定,client.js怎么知道这个yml名字呢?

2如果yml包含client.js不需要的配置内容,如果bundle.js,前端就有可能get到。这是我们不希望的。该怎么在bundle的“compile”阶段做点什么?

目前没想到更好办法,简单加入1个中间步骤。第二轮大概这样:

do_bundle.js:

1用node +cli argv启动,解析得到yml文件名

2读取yml内容,把client.js用到的字段拿出来,保存到给定名字的json临时文件中。比如就"./define.json"

3 执行browserify的打包过程

client.js:

const config = require("./define.json");

完事。

这样的好处,client.js即打包后browser端bundle.js最简单。根本不知道define.json是怎么弄出来的。

这样,只需要do_bundle里创建个临时文件就行了,虽然有点丑,但是本来打包过程就是在后端,系统编程读写个临时文件,算正常操作,不算难看。

const fs = require("fs");
const browserify = require('browserify'); //读命令行参数
const yaml = require('js-yaml');
//const argv = require('yargs').argv;
const argv = require('optimist').argv;
console.log('argv', argv);
//读yaml配置文件
const config = yaml.safeLoad(fs.readFileSync(argv.config,{encoding: 'utf8', flag: "r" }));
console.log('yaml config', config);
//选择部分字段
const prop_name = 'define';
//保存到本地,供打包用./src/define.json
const f_name = `./src/${prop_name}.json`
fs.writeFile(f_name,
JSON.stringify(config[prop_name], null, 4),
{ encoding: "utf8", flag: "w" },
(err)=>{}); browserify('./src/client.js')
.transform('babelify',{presets: ["@babel/preset-env"]})
.bundle()
.pipe(fs.createWriteStream("./static/bundle.js"));

几个细节,yargs不知为什么,在这种模式下不能正确parse出arg,把--字段全都放在_:里了,等于没解析出来。

所以随便换了一个optimist,用法功能都差不多。

读yaml,写json都没啥可说的;

没有用browserify系的 yamlify 和register之类的。这样最简单。基本完全对应browserify命令行,没啥花活。

现在基本实现目的了。就这样吧,稍微有点笨。

让browserify接收命令行参数,在打包时parse yml配置文件的更多相关文章

  1. C#_WinForm接收命令行参数

    C#_WinForm接收命令行参数 2014-08-03 10:17 534人阅读 评论(0) 收藏 举报 首先,我要仔细的声明下,本文讲的是接受命令行参数,让程序启动.而不是启动那个黑黑的框...我 ...

  2. 自定义实现InputFormat、OutputFormat、输出到多个文件目录中去、hadoop1.x api写单词计数的例子、运行时接收命令行参数,代码例子

    一:自定义实现InputFormat *数据源来自于内存 *1.InputFormat是用于处理各种数据源的,下面是实现InputFormat,数据源是来自于内存. *1.1 在程序的job.setI ...

  3. (转)C#_WinForm接收命令行参数

    本文转载自:http://blog.csdn.net/lysc_forever/article/details/38356007 首先,我要仔细的声明下,本文讲的是接受命令行参数,让程序启动.而不是启 ...

  4. Spring Boot程序接收命令行参数

    Spring Boot程序接收命令行参数 输入一行,回车,触发一次.如果想要调用service层,也是可以,能调用service层,就可以做很多事,触发一次就好比调用了一次http接口一样 packa ...

  5. MFC接收命令行参数的三种方法

    方法一: CString sCmdline = ::GetCommandLine(); AfxMessageBox(sCmdline); 将获取到 "C:\test\app.exe -1 - ...

  6. Python命令行参数sys.argv[]

    学习C语言的时候就没弄明白命令行参数的用法,在学习Pyton 的时候又遇到了命令行参数,在这里稍微学习了一下,稍微明白了一些在这里做个记录方便后面回顾复习. Sys.argv[]是用来获取命令行参数的 ...

  7. python命令行参数解析模块argparse和docopt

    http://blog.csdn.net/pipisorry/article/details/53046471 还有其他两个模块实现这一功能,getopt(等同于C语言中的getopt())和弃用的o ...

  8. Golang: 打印命令行参数

    记得最早在学校机房学习 Java 时,照着书上的例子,写一个最简单 main 方法,当程序运行并在屏幕上打印出 hello world 时,内心竟有种莫名的激动,相信很多人都有这种经历吧. 不管学什么 ...

  9. Shell特殊变量:Shell $0, $#, $*, $@, $?, $$和命令行参数

    特殊变量列表 变量 含义 $0 当前脚本的文件名 $n 传递给脚本或函数的参数.n 是一个数字,表示第几个参数.例如,第一个参数是$1,第二个参数是$2. $# 传递给脚本或函数的参数个数. $* 传 ...

随机推荐

  1. Shell批量启动、关闭tomcat

    批量启动tomcat脚本,配置NUM可控制启动数量 #!/bin/bash #identifier CLUSTER_HOME=/opt/cluster-tomcat TNAME=tomcat-- TP ...

  2. 如何将你的github仓库部署到github pages(转)

    原文地址:http://www.cnblogs.com/yuanzm/p/3945814.html#commentform 很多时候我都在思考一个问题,我们每天遇到各种各样的问题,然后我们需要不断go ...

  3. 如何在Framework中读取bundle中的Res

    前因: 因为公司上架前后的原因,外围的平台层部分提前上线,而我做的功能部分需要晚一些上线,是单独的一个工程在其他仓库开发. 我的资源文件放在Bundle中.合到主工程中,资源文件不用改,直接拖进去.倒 ...

  4. tp框架中的一些疑点知识-5

    关于vim中的缓存区的前后bp和bn的界定 通过命令ls可以看到 缓存区的 排序. 最开始打开的文件排在最上面, 序号最小. 那么它们就是 更 前 的缓冲区. 序号更前的用bp, 序号靠后的用bn. ...

  5. Vistual Studio Code配置

    目录 查看版本,帮助: 修改vscode的扩展目录: 用户和工作区设置 用户设置的文件保存在如下目录: 所以有三种方式更改默认的设置: vscode同步配置: vscode启动launch.json配 ...

  6. 前缀判断|2013年蓝桥杯B组题解析第五题-fishers

    前缀判断 如下的代码判断 needle_start指向的串是否为haystack_start指向的串的前缀,如不是,则返回NULL. 比如:"abcd1234" 就包含了 &quo ...

  7. Win32汇编学习(1):基本概念

    背景知识 Windows 把每一个 Win32 应用程序放到分开的虚拟地址空间中去运行,也就是说每一个应用程序都拥有其相互独立的 4GB 地址空间,当然这倒不是说它们都拥有 4GB 的物理地址空间,而 ...

  8. LuoguP1041 传染病控制

    题目地址 题目链接 题解 这里讲一个非正解--贪心+随机化. 贪心的想法是什么? 我们dfs一遍处理出每个节点子树内的节点数量,记为\(siz\). 贪心的砍掉\(siz\)最大的那个子树,在树的形态 ...

  9. P3833 [SHOI2012]魔法树

    思路 树剖板子 注意给出点的编号是从零开始的 代码 #include <cstdio> #include <algorithm> #include <cstring> ...

  10. 微信发送红包示例(php)

    微信红包接口 微信红包是微信支付推出的一款基于微信客户端的免费服务应用,微信红包以微信支付 为核心安全保障,为广大用户提供安全,快捷的移劢支付服务. 请求URL 现金红包 https://api.mc ...