npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

gulp-ng-constant

v1.2.0

Published

Gulp plugin for dynamic generation of angular constant modules.

Downloads

14,534

Readme

gulp-ng-constant

Build Status

Information

Index

  1. Usage
  1. Options
  1. Examples
  1. Special Thanks

Usage

Configuration in gulpfile.js

gulpfile.js

var ngConstant = require('gulp-ng-constant');

gulp.task('config', function () {
  gulp.src('app/config.json')
    .pipe(ngConstant({
      name: 'my.module.config',
      deps: ['ngAnimate'],
      constants: { myPropCnt: 'hola!' },
      wrap: 'amd',
    }))
    // Writes config.js to dist/ folder
    .pipe(gulp.dest('dist'));
});

app/config.json

{
  "myFirstCnt": true,
  "mySecondCnt": { "hello": "world" }
}

dist/config.js (output)

define(["require", "exports"], function(require, exports) {
  return angular.module("my.module.config", ["ngAnimate"])
    .constant("myFirstCnt", true)
    .constant("mySecondCnt", { "hello": "world" })
    .constant("myPropCnt", "hola!");
});

Configuration in config.json

gulpfile.js

var ngConstant = require('gulp-ng-constant');

gulp.task('config', function () {
  gulp.src('app/config.json')
    .pipe(ngConstant())
    // Writes config.js to dist/ folder
    .pipe(gulp.dest('dist'));
});

app/config.json

{
  "name": "my.module.config",
  "deps": ["ngAnimate"],
  "wrap": "commonjs",
  "constants": {
    "myFirstCnt": true,
    "mySecondCnt": { "hello": "world" }
  }
}

dist/config.js (output)

module.exports = angular.module("my.module.config", ["ngAnimate"])
    .constant("myFirstCnt", true)
    .constant("mySecondCnt", { "hello": "world" })
    .constant("myPropCnt", "hola!");

Options

options.name

Type: string
Default: filename or "ngConstants"
Overrides: json.name
optional

The module name. This property will override any name property defined in the input json file. The default name when used as a tranform stream (i.e. regular plugin) is the passed file name. When options.stream is true the default name is "ngConstants".

options.stream

Type: boolean
Default: false
optional

If true it returns a new gulp stream, which can then be piped other gulp plugins (Example).

options.constants

Type: Object | string
Default: undefined
Exends/Overrides: json.constants

Constants to defined in the module. Can be a JSON string or an Object. This property extends the one defined in the input json file. If there are properties with the same name, this properties will override the ones from the input json file.

options.merge

Type: boolean
Default: false
optional

This applies to constants of the Object type. If true the constants of type Object from the input file and the constants from the configuration will be merged.

options.deps

Type: array<string>|boolean
Default: []
Overrides: json.deps
optional

An array that specifies the default dependencies a module should have. To add the constants to an existing module, you can set it to false. This property will override any deps property defined in the input json file.

options.wrap

Type: boolean|string
Default: false
Available: ['amd', 'commonjs']
optional

A boolean to active or deactive the automatic wrapping. A string who will wrap the result of file, use the <%= __ngModule %> variable to indicate where to put the generated module content. A string with 'amd' that wraps the module as an AMD module, compatible with RequireJS

options.space

Type: string
Default: '\t'
optional

A string that defines how the JSON.stringify method will prettify your code.

options.template

Type: string
Default: content of tpls/constant.tpl.ejs
optional

EJS template to apply when creating the output configuration file. The following variables are passed to the template during render:

  • moduleName: the module name (string)
  • deps: the module dependencies (array<string>)
  • constants: the module constants (array<contantObj>)
    • where a constantObj is an object with a name and a value, both strings.

options.templatePath

Type: string
Default: 'tpls/constant.tpl.ejs'
optional

Location of a custom template file for creating the output configuration file. Defaults to the provided constants template file if none provided.

Examples

Multiple Environments

config.json

{
  "development": { "greeting": "Sup!" },
  "production": { "greeting": "Hello" }
}

gulpfile.js

var gulp = require('gulp');
var ngConstant = require('gulp-ng-constant');

gulp.task('constants', function () {
  var myConfig = require('./config.json');
  var envConfig = myConfig[process.env];
  return ngConstant({
      constants: envConfig,
      stream: true
    })
    .pipe(gulp.dest('dist'));
});

Stream

var gulp = require('gulp');
var ngConstant = require('gulp-ng-constant');
var uglify = require('gulp-uglify');

gulp.task('constants', function () {
  var constants = { hello: 'world' };
  return ngConstant({
      constants: constants,
      stream: true
    })
    .pipe(uglify())  
    .pipe(gulp.dest('dist'));
});

YAML

Just write your configuration in a YAML file and pipe it to the plugin.

config.yml

greeting: Merry Christmas!
seasons:
  - Winter
  - Spring
  - Summer
  - Fall

gulpfile.js

var gulp = require('gulp');
var ngConstant = require('gulp-ng-constant');

gulp.task('constants', function () {
  gulp.src('app/config.yml')
    .pipe(ngConstant())
    .pipe(gulp.dest('dist'));
});

Special Thanks

@alexeygolev, @sabudaye, @ojacquemart, @lukehorvat, @rimian, @andidev, @dotDeeka, @LoicMahieu