In this lesson we will look at pulling out complex npm script logic into an external JavaScript file. Instead of writing bash scripts you can leverage your JavaScript abilities to automate your build process. We’ll use some helper node modules such as shelljs, opn-cli, and babel-cli.

Install:

npm i -D shelljs babel-cli

From:

"test": "BABEL_ENV=test mocha spec/ --require babel-register",

To:

1. create a "scripts/test.js" file.

2. Add content:

import { exec } from "shelljs";

const isWindows = process.platform === "win32";
const environment = isWindows ?
"set BABEL_ENV=test&&" :
"BABEL_ENV=test"; exec( `${ environment } mocha spec/ --require babel-register` );

3. Change package.json

"test": "babel-node ./scripts/test.js",

From:

    "build": "npm-run-all build:*",
"prebuild": "rm -rf public/$npm_package_version",
"build:html": "pug --obj data.json src/index.pug --out public/$npm_package_version/",
"build:css": "node-sass src/index.scss | postcss -c .postcssrc.json | cssmin > public/$npm_package_version/index.min.css",
"build:js": "mustache data.json src/index.mustache.js | uglifyjs > public/$npm_package_version/index.min.js",

To:

1. create "scripts/build.js".

2. Add content:

import { rm, exec } from "shelljs";

const version = process.env.npm_package_version;

rm( "-rf", `public/${ version }` );
exec( `pug --obj data.json src/index.pug --out public/${ version }/` );
exec( `node-sass src/index.scss | postcss -c .postcssrc.json | cssmin > public/${ version }/index.min.css` );
exec( `mustache data.json src/index.mustache.js | uglifyjs > public/${ version }/index.min.js` );

3. Change package.json:

"build": "babel-node ./scripts/build.js",

From:

    "server": "npm-run-all --parallel server:*",
"server:create": "http-server public/$npm_package_version -p $npm_package_config_port",
"server:launch": "open http://localhost:$npm_package_config_port",

To:

1. Create "scripts/server.js".

2. Add content:

import { exec } from "shelljs";

const {
npm_package_version: version,
npm_package_config_port: port
} = process.env; exec( `http-server public/${ version } -p ${ port }`, { async: true } );
exec( `opn http://localhost:${ port }` );

3. Change package.json file:

"server": "babel-node ./scripts/server.js",

Be careful that in Windows single quote doesn't work, we need to replace single quote to

\"

[NPM] Create a node script to replace a complex npm script的更多相关文章

  1. [NPM] Create a bash script to replace a complex npm script

    In this lesson we will look at pulling out complex npm scripts into their own external bash scripts. ...

  2. npm不能安装任何包,报错:npm WARN onload-script failed to require onload script npm-autoinit/autoinit及解决方法

    想要利用Hexo搭建一个博客,但是安装时npm一直报错,不仅仅是Hexo包,连别的其他包也不行,会提示下面的一堆错误 npm WARN onload-script failed to require ...

  3. npm ERR! Failed at the gff@1.0.0 start script.

    code ELIFECYCLE npm ERR! errno 1 npm ERR! gff@1.0.0 start: `node build/dev-server.js` npm ERR! Exit ...

  4. io.js - 兼容 NPM 平台的 Node.js 新分支

    io.js(JavaScript I/O)是兼容 NPM 平台的 Node.js 新分支,由 Node.js 的核心开发者在 Node.js 的基础上,引入更多的 ES6 特性,它的目的是提供更快的和 ...

  5. 快速搭建 Node.js 开发环境以及加速 npm

    如何快速搭建 node 开发环境 npm 超慢 github 无法打开的问题 于是我觉得应该写一篇文章解答所有这些起步问题,让新同学也能顺顺利利入门. 快速搭建 Node.js 开发环境 如果你想长期 ...

  6. Node.js 学习(三) NPM 使用介绍

    NPM是随同NodeJS一起安装的包管理工具,能解决NodeJS代码部署上的很多问题,常见的使用场景有以下几种: 允许用户从NPM服务器下载别人编写的第三方包到本地使用. 允许用户从NPM服务器下载并 ...

  7. 编程语言 Node.js中使用到的npm工具

    啥是npm? npm就是(node package manager)包结点管理器,它随同Node.js一起安装的,由于新版的nodejs已经集成了npm,所以之前npm也一并安装好了. 同样可以通过输 ...

  8. vue(1)——node.js安装使用,利用npm安装vue

    node node简介 node.js也是用js开发的语言,而且是一门服务端语言,更有大神利用node写了一个操作系统出来——NodeOS node能干什么 自带下载工具: 对于我们开发前端项目,no ...

  9. Node.js相关——package概念及NPM

    1. package 包 CommonJS的包规范允许我们将一组相关的模块组合到一起,形成一组完整的工具.CommonJS的包规范由 包结构 和 包描述文件 两个部分组成. 1.1 包结构 包实际上就 ...

随机推荐

  1. 【SSH学习笔记】—从配置Struts1环境到简单实例

    以下我将从一个简单点的计算器实例,介绍struts1的环境配置,以及其重要的两个核心类:ActionForm和Action  简单计算器实现思路: 1.提供一个输入界面,输入两个数字和运算符(+.-. ...

  2. 纯C++实现的HTTP请求封装(POST/GET)

    纯C++实现的HTTP请求(POST/GET),支持windows和linux, 进行简单的封装, 方便调用.实现如下: #include "HttpConnect.h" #ifd ...

  3. 2.写给设计师看的HTML&CSS入门指导

    转自:http://www.uisdc.com/html-and-css-guide 整体简介 在开始学习HTML&CSS之前,首先要搞清楚两者的区别.两者在整体上有着很明显的差异. 整体看来 ...

  4. 16、cgminer学习之:popen函数和system函数详解(执行系统命令)

    1.popen函数我们先用man指令查一下popen函数: 函数说明: (1)popen()会调用fork()产生子进程,然后从子进程中调用/bin/sh -c来执行参数command的指令. (2) ...

  5. Python 极简教程(十三)while 循环

    循环简单来说就是让一段代码按你想要的方式多次运行.软件拥有强大的运算能力,就是由循环提供的. 在 Python 中支持的循环由两种:while 循环 和for 循环. 现在我们先来讲while循环. ...

  6. JSP学习 —— 开篇:JSP,servlet容器,Tomcat,servlet容器之间的关系

    JSP(JAVA SERVER PAGE)的缩写,其本身就是servlet的简化,是一种动态网页标准,其特点是在HTML代码中嵌入JAVA代码,JSP标签或用户标签来生成网页.至于它为什么会出现,主要 ...

  7. 使用 Python 第三方库 daft 绘制 PGM 中的贝叶斯网络

    daft 的官方文档请见 DAFT:BEAUTIFULLY RENDERED PROBABILISTIC GRAPHICAL MODELS. from matplotlib import rc rc( ...

  8. Linux中IRC通讯工具Pidgin的基本用法

    这是我发在南昌大学开源小组里的一篇教程 IRC IRC是个古老的产物,在图形界面流行之前就出现了.可是在现在非常多开源社区都是利用IRC来进行团队交流或对用户提供技术支持的,比方维基百科,所以还是有必 ...

  9. 大战C100K之-Linux内核调优篇--转载

    原文地址:http://joyexpr.com/2013/11/22/c100k-4-kernel-tuning/ 早期的系统,系统资源包括CPU.内存等都是非常有限的,系统为了保持公平,默认要限制进 ...

  10. [Angular] Implementing A General Communication Mechanism For Directive Interaction

    We have modal implement and now we want to implement close functionality. Becuase we use a structure ...