1
角型材でangle2を使用します。以下 は私のpackage.jsonであるanglejs 2角張った材質/角型/コアが見つかりません
{
"name": "angular2-boilerplate",
"version": "1.0.0",
"scripts": {
"lite": "lite-server",
"gulp": "gulp",
"start": "concurrent \"npm run gulp\" \"npm run lite\" "
},
"license": "ISC",
"dependencies": {
"@angular2-material/button": "^2.0.0-alpha.2",
"@angular2-material/checkbox": "^2.0.0-alpha.2",
"@angular2-material/core": "^2.0.0-alpha.2",
"@angular2-material/progress-circle": "^2.0.0-alpha.2",
"@angular2-material/toolbar": "^2.0.0-alpha.2",
"@angular2-material/input": "^2.0.0-alpha.2",
"@angular2-material/card": "^2.0.0-alpha.2",
"angular2": "2.0.0-beta.15",
"angular2-jwt": "0.1.9",
"cors": "2.7.1",
"es6-promise": "3.1.2",
"es6-shim": "^0.35.0",
"express": "4.13.4",
"express-jwt": "3.3.0",
"systemjs": "0.19.25",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.2",
"zone.js": "0.6.6"
},
"devDependencies": {
"autoprefixer": "^6.3.5",
"cssnano": "^3.4.0",
"concurrently": "^2.0.0",
"gulp": "^3.9.0",
"gulp-ext-replace": "^0.2.0",
"gulp-imagemin": "^2.4.0",
"gulp-postcss": "^6.0.1",
"gulp-sourcemaps": "^1.6.0",
"gulp-typescript": "^2.10.0",
"gulp-uglify": "^1.5.1",
"lite-server": "^2.1.0",
"postcss": "^5.0.13",
"postcss-scss": "^0.1.3",
"precss": "^1.3.0"
}
}
のTSconfigは
{
"compilerOptions": {
"target": "ES5",
"module": "system",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"removeComments": false,
"noImplicitAny": false,
"outDir": "./app"
},
"filesGlob": [
"./dev/**/*.ts",
"!./node_modules/**/*.ts"
],
"exclude": [
"node_modules",
"typings/main",
"typings/main.d.ts"
],
"atom": {
"rewriteTsconfig": true
}
}
であると私はangular-からそれをインポートすることにより、自分のアプリケーションでMdButtonを使用しようとしているときはいつでもSystemJsは
System.config({
defaultJSExtensions: true,
map: {
"angular2-jwt": "node_modules/angular2-jwt/angular2-jwt",
"angular2": "node_modules/angular2",
"rxjs": "node_modules/rxjs",
'@angular2-material/core': 'node_modules/@angular2-material/core',
'@angular2-material/checkbox': 'node_modules/@angular2-material/checkbox/checkbox',
'@angular2-material/button': 'node_modules/@angular2-material/button/button',
'@angular2-material/progress-circle': 'node_modules/@angular2-material/progress-circle/progress-circle',
'@angular2-material/card': 'node_modules/@angular2-material/card/card',
'@angular2-material/input': 'node_modules/@angular2-material/input/input',
'@angular2-material/toolbar': 'node_modules/@angular2-material/toolbar/toolbar',
}
});
System.import('app/boot')
.then(null, console.error.bind(console));
です材料はimport {MdButton} from '@angular2-material/button';となり、以下のようにエラーが発生します
"NetworkError: 404 Not Found - http://localhost:3000/@angular/core.js"
core.js
Error: patchProperty/desc.set/[email protected]://localhost:3000/node_modules/angular2/bundles/angular2-polyfills.js:830:27
Zone</ZoneDelegate</[email protected]://localhost:3000/node_modules/angular2/bundles/angular2-polyfills.js:423:24
Zone</Zone</[email protected]://localhost:3000/node_modules/angular2/bundles/angular2-polyfills.js:320:29
ZoneTask/[email protected]://localhost:3000/node_modules/angular2/bundles/angular2-polyfills.js:490:29
Error loading http://localhost:3000/@angular/core.js as "@angular/core" from http://localhost:3000/node_modules/@angular2-material/button/button.js
var newErr = new Error(newMsg, err.fileName, err.lineNumber);
node_modules内に@angularフォルダが見つかりませんでした。必要に応じてそのフォルダを取得するには？
なぜ失敗していますか？
注：角度材料からの依存関係を取り除くと、私のアプリケーションは正常に動作します。