I am working on an angular project and have decided to use a boilerplate for it. Here is the link to the boilerplate: https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate
The problem i am facing is that i am unable to add any new moudle.
e.g i wanted to add ngCart via npm. I have installed it but it is not accessible in the code.
`import angular from 'angular'; // angular modules import constants from './constants'; import onConfig from './on_config'; import onRun from './on_run'; import 'angular-ui-router'; import 'ngCart'; //this doesn't import it import './templates'; import './filters'; import './controllers'; import './services'; import './directives'; // create and bootstrap application const requires = [ 'ui.router', 'ngCart', 'templates', 'app.filters', 'app.controllers', 'app.services', 'app.directives' ]; // mount on window for testing window.app = angular.module('app', requires); angular.module('app').constant('AppSettings', constants); angular.module('app').config(onConfig); angular.module('app').run(onRun); angular.bootstrap(document, ['app'], { strictDi: true }); My package.json is
{ "name": "angularjs-gulp-browserify-boilerplate", "version": "1.7.1", "author": "Jake Marsh <jakemmarsh@gmail.com>", "description": "Boilerplate using AngularJS, SASS, Gulp, and Browserify while also utilizing best practices.", "repository": { "type": "git", "url": "https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplate.git" }, "license": "MIT", "keywords": [ "express", "gulp", "browserify", "angular", "sass", "karma", "jasmine", "protractor", "boilerplate" ], "private": false, "engines": { "node": "~4.2.x" }, "scripts": { "dev": "cross-env NODE_ENV=development ./node_modules/.bin/gulp dev", "build": "cross-env NODE_ENV=production ./node_modules/.bin/gulp prod", "deploy": "cross-env NODE_ENV=production ./node_modules/.bin/gulp deploy", "test": "cross-env NODE_ENV=test ./node_modules/.bin/gulp test", "protractor": "cross-env NODE_ENV=test ./node_modules/.bin/gulp protractor", "unit": "cross-env NODE_ENV=test ./node_modules/.bin/gulp unit" }, "dependencies": { "cross-env": "^3.1.1", "ngCart": "1.0.0" }, "devDependencies": { "angular": "^1.5.0", "angular-mocks": "^1.3.15", "angular-ui-router": "^0.3.1", "babel-core": "^6.3.26", "babel-eslint": "^7.0.0", "babel-preset-es2015": "^6.3.13", "babel-register": "^6.5.2", "babelify": "^7.2.0", "brfs": "^1.2.0", "browser-sync": "^2.7.6", "browserify": "^13.0.0", "browserify-istanbul": "^2.0.0", "browserify-ngannotate": "^2.0.0", "bulk-require": "^1.0.0", "bulkify": "^1.1.1", "debowerify": "^1.3.1", "del": "^2.1.0", "envify": "^3.4.0", "ngCart": "^1.0.0", "eslint": "3.7.1", "express": "^4.13.3", "gulp": "^3.9.0", "gulp-angular-templatecache": "^2.0.0", "gulp-autoprefixer": "^3.1.0", "gulp-changed": "^1.0.0", "gulp-eslint": "^3.0.1", "gulp-gzip": "^1.2.0", "gulp-if": "^2.0.0", "gulp-imagemin": "^3.0.3", "gulp-notify": "^2.0.0", "gulp-protractor": "^3.0.0", "gulp-rename": "^1.2.0", "gulp-sass": "^2.0.4", "gulp-sass-glob": "^1.0.6", "gulp-sourcemaps": "^1.6.0", "gulp-streamify": "^1.0.2", "gulp-uglify": "^2.0.0", "gulp-util": "^3.0.1", "imagemin-pngcrush": "^5.0.0", "isparta": "^4.0.0", "karma": "^1.3.0", "karma-browserify": "^5.0.2", "karma-chrome-launcher": "^2.0.0", "karma-coverage": "douglasduteil/karma-coverage#next", "karma-firefox-launcher": "^1.0.0", "karma-jasmine": "^1.0.2", "karma-sauce-launcher": "^1.0.0", "merge-stream": "^1.0.0", "pretty-hrtime": "^1.0.1", "run-sequence": "^1.1.5", "tiny-lr": "^0.2.1", "uglifyify": "^3.0.1", "vinyl-buffer": "^1.0.0", "vinyl-source-stream": "^1.1.0", "watchify": "^3.7.0" } } 1 Answers
Answers 1
ngCart does not have a main key in its package.json, nor an index.js at its root, so import can not know what to import. So you need to be a little more explicit in your import statement.
try to replace
import 'ngCart'; //this doesn't import it
by
import 'ngCart/dist/ngCart'; //this should do it ;)
0 comments:
Post a Comment