Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@songkick/injectassets

Package Overview
Dependencies
Maintainers
2
Versions
5
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@songkick/injectassets

Utility to inject reference or inline assets in your HTML

  • 1.1.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
1
Maintainers
2
Weekly downloads
 
Created
Source

injectassets Build Status

Utility to inject reference or inline assets in your HTML

Use cases

Usage

  1. Write a basic (HTML) mustache template using extensions as iterators:

    <html>
    <head>
        <title>injectassets - example</title>
    
        {{#inline_css}}
        <style>{{{.}}}</style>
        {{/inline_css}}
    
        {{#css}}
        <link href="{{{.}}}" rel="stylesheet" type="text/css">
        {{/css}}
    </head>
    <body>
        <h1>It works!</h1>
        {{#js}}
        <script src="{{{.}}}"></script>
        {{/js}}
    
        {{#inline_js}}
        <script>{{{.}}}</script>
        {{/inline_js}}
    </body>
    </html>
    
    
  2. Run the command:

    Usage: injectassets [options]
    
    Options:
    
    -h, --help                        output usage information
    -V, --version                     output the version number
    -s, --source <path to template>   template file path, default: stdin
    -o, --output <path>               result output path, default: stdout
    -g, --reference-globs <globs...>  globs for files to be inject as references
    -G, --inline-globs <globs...>     globs for files to be inlined
    -d, --dir <assets folder>         injected assets directory, default: "./"
    -p, --pattern <string>            use this pattern to generate paths, default {dir}/{base}
    -t, --tags <string>               specify open/close tags. default: "{{,}}"
    -w, --watch                       run on every source file change
    -e, --encoding <string>           read/write encoding, encoding "utf-8"
    

Examples

  • Use stdin and stdout, insert files path with the -g, --reference-globs option.

    cat src/index.html | injectassets -g '*.{css,js}'
    # print HTML to stdout
    
  • Use a source file

    injectassets -g '*.{css,js}' -s src/index.html
    
  • Output to a file

    cat src/index.html | injectassets -g '*.{css,js}' -o dist/index.html
    # or simply
    cat src/index.html | injectassets -g '*.{css,js}' > dist/index.html
    
  • Specify directory containing the assets with -d, --dir

    cat src/index.html | injectassets -d 'dist/' -g '*.{css,js}'
    
  • Decide how files path will be formatted. Keys are all the values returned by path.parse() (i.e: root, dir, base, name, ext)

    cat src/index.html | injectassets -g '*.{css,js}' -p '/public/{name}{ext}'
    
  • Inline files content with the -G, --inline-globs option

    cat src/index.html | injectassets -G '*.{css,js}'
    
  • Inline some files, inject references some others

    cat src/index.html | injectassets -G 'critical*.{css,js}' -g '!(critical)*.{css,js}'
    
  • Specify multiple globs separating them with ;

    cat src/index.html | injectassets -G 'scripts/*.js;styles/*.css'
    
  • Watch for any change on specified globs and rerun automatically with -w, --watch

    cat src/index.html | injectassets -G 'scripts/*.js;styles/*.css' -w -o dist/index.html
    
  • Use square brackets instead of curly brackets for template:

    cat src/index.html | injectassets -t '[[,]]' -g '*.{css,js}'
    

Keywords

FAQs

Package last updated on 19 May 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc