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. 如何使用maven 打包源代码呢?

    如何使用maven 打包源代码呢? http://hw1287789687.iteye.com/blog/1943157

  2. OrmLite使用小结(一)

    在使用OrmLite过程中,遇到了不少问题.鉴于中文文档比較少,看英文文档又不知道怎样看起.仅仅能遇到问题查找解决方法并整理出来,如有错误,希望能指正! ** 1.模糊条件查询 ** 使用条件查询时. ...

  3. animation- 动画效果实现(代码中)

    1,首先我们看一下如下的代码 import android.view.animation.LayoutAnimationController; import android.view.animatio ...

  4. matlab 可视化 —— 高级 api(montage)、insertObjectAnnotation、insertMaker

    1. montage:同时显示多个图像 thumbnails = train_x(:, :, :, 1:100); thumbnails = imresize(thumbnails, [64, 64] ...

  5. 98.TCP通信传输文件

    客户端 #define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include <stdlib.h> #include <s ...

  6. valueof(), intvalue(0 parseint() 这三个方法怎么用

    valueOf(int i) 返回一个表示指定的 int 值的 Integer 实例.valueOf(String s) 返回保存指定的 String 的值的 Integer 对象.valueOf(S ...

  7. apache+nginx 实现动静分离

    apache+nginx 实现动静分离 http://blog.csdn.net/xysoul/article/details/50347971

  8. var let 区别

    var a = 5; var b = 10; if (a === 5) { let a = 4; // if 块级作用域 var b = 1; // 函数级作用域 console.log(a); // ...

  9. Node.js自学笔记之回调函数

    写在前面:如果你是一个前端程序员,你不懂得像PHP.Python或Ruby等动态编程语言,然后你想创建自己的服务,那么Node.js是一个非常好的选择.这段时间对node.js进行了简单的学习,在这里 ...

  10. wepy小程序实现列表分页上拉加载(2)

    第一篇:wepy小程序实现列表分页上拉加载(1) 本文接着上一篇内容: 4.优化-添加加载动画 (1)首先写加载动画的结构和样式 打开list.wpy文件 template结构代码: <temp ...