cdnex v0.1.5
An easy way to prepend your CDN urls to your HTML and CSS files. It can be integrated into any existing workflow, and customized to meet the needs of your project. Use the CLI tool for quick use or use the API to implement programmatically.
What is this?
cdnex will take an input of either a file path or a string, prepend a given url to all urls in the source that are not pointing to an external source (ex. anything that starts with http://, https://, or //), and will output either a new file (if a file was supplied as the source), or the processed string. Take the following HTML as an example:
<html>
<head>
<link rel="stylesheet" type="text/css" href="/app.css">
</head>
<body>
<img src="/img/logo.png" class="logo">
<script src="https://ajax.googleapis.com/.../jquery.min.js"></script>
<script src="/app.js"></script>
</body>
</html>If the above file is specified as the input with a CDN url of https://cdn.mysite.com, the output would look like this:
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://cdn.mysite.com/app.css">
</head>
<body>
<img src="https://cdn.mysite.com/img/logo.png" class="logo">
<script src="https://ajax.googleapis.com/.../jquery.min.js"></script>
<script src="https://cdn.mysite.com/app.js"></script>
</body>
</html>cdnex is built handle HTML and CSS files by default, but it can be used with any kind of input string.
Install
# to use the cli #
npm install cdnex -g
# to use the api #
npm install cdnex --saveUsage with CLI
If installed globally, cdnex will be in your system path.
$ cdnex src/index.html --output dist/index.html --url https://mycdn.com
# you can also specify directories #
$ cdnex src -o dist -u https://mycdn.com
# specify pattern and additional extensions #
$ cdnex src -o dist -p "**/*.html" -e "pdf,docx" -u https://mycdn.com
# specify a regex ignore pattern #
$ cdnex src -o dist -u https://mycdn.com -i "\/img\/"
# help #
$ cdnex --helpUsage with API
You can also use cdnex programmatically.
.render (options)
Returns a promise resolving with a boolean if an output path is specified, or with the rendered string if no output path is specified.
options
input - Input path of your file(s). Can be a directory or a single file.
Type:
stringsrc - An input string to parse. Note this is different from
input, as that is a path to read from, and this is the actual content.Type:
stringoutput - Output path for your rendered file(s). If no output is supplied, the result will be sent to the result of the promise.
Type:
stringurl - The CDN url to use when rendering.
Type:
stringvalidate - Whether to make sure CDN url is a valid url.
Type:
boolean
Default:falseforce - Whether to force overwriting any existing files. You will be prompted to overwrite if this is set to
false.Type:
boolean
Default:falsepattern - A glob-style pattern of the files to include when searching a directory. Relative to your
inputpath.Type:
string
Default:**/*.{html,css}ignore - A string or array of regex url(s) to ignore when prepending the CDN url. (Note: this is for the urls in your files, not the files themselves. Use
patternfor that).Type:
string or arrayextensions - An array of any extra extensions that extend from the defaults.
Type:
arrayonlyExtensions - An array of extensions that will overwrite the defaults.
Type:
arrayquiet - Whether to hold back from all output except errors.
Type:
boolean
Default:false
Examples
/* with ES5 */
var cdnex = require('cdnex')
/* with ES6 */
import { render } from 'cdnex'
/* using an input and output directory */
cdnex.render({
input: 'src',
output: 'dist',
url: 'https://mycdn.com',
})
/* using a src instead of a path */
cdnex.render({
src: fs.readFileSync('index.html', 'utf8'),
output: 'dist/index.html',
url: 'https://mycdn.com',
})
/* if no output is specified, get output in promise result */
cdnex.render({
src: fs.readFileSync('index.html', 'utf8'),
url: 'https://mycdn.com',
}).then(function(rendered) {
console.log(rendered)
}).catch(function(err) {
console.log(err)
})
/* only replace .css and .js files in your HTML */
cdnex.render({
...
pattern: '**/*.html',
onlyExtensions: ['.css', '.js'],
})
/* add .pdf extension to the default extensions */
cdnex.render({
...
extensions: ['.pdf']
})Extensions
By default, cdnex will prepend the CDN url to all internal paths with the following extensions: .html, .css, .js, .png, .jpg, .jpeg, .gif, .svg, .woff, .woff2, .eot, .ttf, .otf, .mp4, .webm, .ogg, .mp3, .wav. To add additional extensions, use the extensions option. To replace this list with a new list, use the onlyExtensions option.