8
私は目立つプロジェクトに取り組んでおり、定型文を使用することに決めました。ここに定型訳へのリンクがあります：https://github.com/jakemmarsh/angularjs-gulp-browserify-boilerplateAngularJsの新しいモジュールを追加できません。Boilerplate
私が直面している問題は、私は新しいmoudleを追加できないということです。
たとえば、ngCartをnpmで追加したいとします。私はそれをインストールしましたが、コード内ではアクセスできません。
`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
});
私のpackage.jsonは
{
"name": "angularjs-gulp-browserify-boilerplate",
"version": "1.7.1",
"author": "Jake Marsh <[email protected]>",
"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"
}
}
によって
import 'ngCart'; //this doesn't import itを交換しようとすると、一般的に、あなたは一つのファイルにそれらすべてをコンパイルする必要があります。どのようにこれをやっている？ Gulpfile.jsを投稿できますか？ – meyer9
npmはserversideパッケージマネージャです。 'bower'のようなものはクライアント側のパッケージを簡単にインストールできるようにします。 – meyer9
そのモジュールのint型を知るには、 'tsd'または' @ types'、つまりそのモジュールの型定義をインストールする必要があります。また、インポートを書くだけで、出力2のバンドルに含めることはできません。 – harishr