angular2如何使用WebJAR消除npm依赖关系
Angular2RC.5我有没有办法摆脱npm依赖，让它们成为webjars-maven依赖 我可以用同样的方法解决打字依赖关系吗？那么我在上一篇文章中附加的systemconfig.js映射呢 下面是我的package.jsonangular2如何使用WebJAR消除npm依赖关系,angular,npm,webjars,Angular,Npm,Webjars,Angular2RC.5我有没有办法摆脱npm依赖，让它们成为webjars-maven依赖 我可以用同样的方法解决打字依赖关系吗？那么我在上一篇文章中附加的systemconfig.js映射呢 下面是我的package.json { "name": "angular2-quickstart", "version": "1.0.0", "scripts": { "postinstall": "typings install", "tsc": "tsc", "t
{
"name": "angular2-quickstart",
"version": "1.0.0",
"scripts": {
"postinstall": "typings install",
"tsc": "tsc",
"tsc:w": "tsc -w",
"typings": "typings"
},
"license": "ISC",
"dependencies": {
"@angular/common": "2.0.0-rc.5",
"@angular/compiler": "2.0.0-rc.5",
"@angular/core": "2.0.0-rc.5",
"@angular/forms": "0.3.0",
"@angular/http": "2.0.0-rc.5",
"@angular/platform-browser": "2.0.0-rc.5",
"@angular/platform-browser-dynamic": "2.0.0-rc.5",
"@angular/router": "3.0.0-rc.1",
"@angular/router-deprecated": "2.0.0-rc.2",
"@angular/upgrade": "2.0.0-rc.5",
"systemjs": "0.19.27",
"core-js": "^2.4.0",
"reflect-metadata": "^0.1.3",
"rxjs": "5.0.0-beta.6",
"zone.js": "^0.6.12",
"angular2-in-memory-web-api": "0.0.15",
"bootstrap": "^3.3.6"
},
"devDependencies": {
"concurrently": "^2.0.0",
"lite-server": "^2.2.0",
"typescript": "^1.8.10",
"typings": "^1.0.4"
}
}
<plugin>
<groupId>org.codehaus.mojo</groupId>
<artifactId>exec-maven-plugin</artifactId>
<executions>
<execution>
<id>exec-npm-install</id>
<phase>generate-sources</phase>
<configuration>
<workingDirectory>${project.basedir}/src/main/resources/static</workingDirectory>
<executable>npm</executable>
<arguments>
<argument>install</argument>
</arguments>
</configuration>
<goals>
<goal>exec</goal>
</goals>
</execution>
<execution>
<id>exec-npm-run-tsc</id>
<phase>generate-sources</phase>
<configuration>
<workingDirectory>${project.basedir}/src/main/resources/static</workingDirectory>
<executable>npm</executable>
<arguments>
<argument>run</argument>
<argument>tsc</argument>
</arguments>
</configuration>
<goals>
<goal>exec</goal>
</goals>
</execution>
</executions>
</plugin>
我使用的是spring boot，我做了以下工作，它运行平稳。 INDEX.HTML
<!DOCTYPE HTML>
<html>
<head>
<!-- Set the base href -->
<link rel="icon" href="images/favicon.ico" type="image/x-icon"></link>
<base href="/"/>
<title>APP</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet"
href="webjars/bootstrap/css/bootstrap.css"></link>
<link rel="stylesheet"
href="webjars/bootstrap/css/bootstrap.min.css"></link>
<link rel="stylesheet" href="styles.css"></link>
<script src="webjars/core-js/client/shim.min.js"></script>
<script src="webjars/zone.js/dist/zone.js"></script>
<script src="webjars/reflect-metadata/0.1.3/Reflect.js"></script>
<script src="webjars/systemjs/dist/system.src.js"></script>
<script src="webjars/bootstrap/js/bootstrap.min.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>
<body>
<app>
<h1>Loading...</h1>
</app>
</body>
</html>
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-locator</artifactId>
<version>0.30</version>
</dependency>
org.webjars
webjars定位器
0.30
仅此而已，不需要庞大的节点单元模块。关于typescript编译，我仍在研究它我无法理解ts编译，因此无法使用它。我在eclipse IDE中构建了我的应用程序，并使用了palantir/eclipse typescript插件。编译ts文件。我只在angular 2参考中使用WebJAR。这里我们讨论的是将npm依赖项作为WebJAR，然后编译tsc文件会导致错误。仍然没有解决。
<!DOCTYPE HTML>
<html>
<head>
<!-- Set the base href -->
<link rel="icon" href="images/favicon.ico" type="image/x-icon"></link>
<base href="/"/>
<title>APP</title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE10"/>
<meta name="viewport" content="width=device-width, initial-scale=1"/>
<link rel="stylesheet"
href="webjars/bootstrap/css/bootstrap.css"></link>
<link rel="stylesheet"
href="webjars/bootstrap/css/bootstrap.min.css"></link>
<link rel="stylesheet" href="styles.css"></link>
<script src="webjars/core-js/client/shim.min.js"></script>
<script src="webjars/zone.js/dist/zone.js"></script>
<script src="webjars/reflect-metadata/0.1.3/Reflect.js"></script>
<script src="webjars/systemjs/dist/system.src.js"></script>
<script src="webjars/bootstrap/js/bootstrap.min.js"></script>
<script src="systemjs.config.js"></script>
<script>
System.import('app').catch(function(err){ console.error(err); });
</script>
</head>
<body>
<app>
<h1>Loading...</h1>
</app>
</body>
</html>
(function(global) {
// map tells the System loader where to look for things
var map = {
'app': 'app', // 'dist',
'rxjs': 'webjars/rxjs/5.0.0-beta.6',
'angular2-in-memory-web-api': 'webjars/angular2-in-memory-web-api/0.0.15',
'@angular/common': 'webjars/angular__common/2.0.0-rc.5',
'@angular/compiler': 'webjars/angular__compiler/2.0.0-rc.5',
'@angular/forms': 'webjars/angular__forms/0.3.0',
'@angular/core': 'webjars/angular__core/2.0.0-rc.5',
'@angular/http': 'webjars/angular__http/2.0.0-rc.5',
'@angular/platform-browser': 'webjars/angular__platform-browser/2.0.0-rc.5',
'@angular/platform-browser-dynamic': 'webjars/angular__platform-browser-dynamic/2.0.0-rc.5',
'@angular/router': 'webjars/angular__router/3.0.0-rc.1',
'@angular/router-deprecated': 'webjars/router-deprecated/2.0.0-rc.2'
};
// packages tells the System loader how to load when no filename and/or no extension
var packages = {
'app': { main: 'main.js', defaultExtension: 'js' },
'rxjs': { defaultExtension: 'js' },
'angular2-in-memory-web-api': { defaultExtension: 'js' },
};
var packageNames = [
'@angular/common',
'@angular/compiler',
'@angular/forms',
'@angular/core',
'@angular/http',
'@angular/platform-browser',
'@angular/platform-browser-dynamic',
'@angular/router',
'@angular/router-deprecated',
];
// add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
packageNames.forEach(function(pkgName) {
packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});
var config = {
map: map,
packages: packages
}
System.config(config);
})(this);
<dependency>
<groupId>org.webjars</groupId>
<artifactId>webjars-locator</artifactId>
<version>0.30</version>
</dependency>