Code Injector

This a library is used to generate code and inject them in target code block so that you could feel like make use of NodeJS in browser side.

People nowadays use webpack more frequently than gulp. However, webpack, most of the time, makes use of babel and transforms (compile) code in memory or build files in production stage. These transformed codes are invisible as we cannot see or use them directly. Therefore, babel plugins sometimes may be misleading and that's the reason why I choose gulp rather than webpack or babel to achieve the purpose of code injection.

Quick Start

npm install code-injector -g #use yarn if you want to

code-injector # wait a moment brefore you do this

Command

Usage: index [options]

Options:

-h, --help         output usage information
-V, --version      output the version number
-c, --config-path  config file, default path is generator.config.js

Config File

Before you run the code-injector command, you will need to prepare a config file at the root of your project and named it generator.config.js.

A few rules you need to code and understand in this file:

/**
* a useful function that could be used to generator any code you want
* @type {[*]}
*/
export function generatorStart() {
    return `console.time();`;
}
/**
* a useful function that could be used to generator any code you want
* @type {[*]}
*/
export function generatorEnd() {
    return `console.timeEnd();`;
}
/**
* required
* the file you want to watch and compile
*/
export const watchSrc = [`./test/index.js`];
/**
* default: generator
* prefix used to indicate which function is going to be used
* e.g. generatorTest
*/
export const prefix = `generator`;

Code Block

The previous part has defined generatorStart and generatorEnd. So start represents its function return value console.time(), whereas end represents its function return value console.endTime(), so you could define the code block like this,

/* inject:start */
/* end-inject */

// WRITE YOU OWN CODE HERE

/* inject:end */
/* end-inject */

Start Now

Now you can run the command:

code-injector

TODO List

• only compile when the code block changed rather than the entire file changed
• remove the package dependency of gulp-inject

License

MIT