多Angular2应用，单一供应商库

我想主办利用相同的框架包，从根node_modules和子域的各种Angular2应用：多Angular2应用，单一供应商库

domain.com
subdomain.domain.com
sub2.domain.com

文件夹结构

public_html 
├── SUBDOMAINS 
│   ├── sub2 
│   │   ├── assets 
│   │   └── src 
│   └── subdomain 
│    ├── assets 
│    └── src 
├── assets 
├── boot.ts 
├── index.html 
├── node_modules 
├── package.json 
├── src 
└── tsconfig.json

我希望能够利用根应用的资源，而不是需要复制的代码。

来源

2016-05-12 Dov Benyomin Sohacheski

什么是你angular2版本？你如何打包你的资产？我有'webpack'的设置，如果你有兴趣，我会发布它。 – Abdulrahman

我正在使用'System.js'并运行最新版本的Angular。 –

我想你需要使用'gulp'来捆绑'SystemJS'资源。我没有自己做，但[检查此答案]（http://stackoverflow.com/a/34616199/3125880）。他还使用'jspm'。这与你需要的基本相同，你只需要修改目的地。 – Abdulrahman

这样做的一种方法是使用webpack和gulp。您需要在您的tsconfig.json中使用commonjs作为模块。

使用webpack将每个单独的项目ts文件打包为一个包。
在gulp任务的帮助下，您可以将每个项目分组在不同的
目标文件夹中。
为每个项目目标文件夹创建index.html文件，并且将其中的js/ts包作为脚本包含在其中。

使用webpack dev服务器为每个项目index.html文件监听不同的端口。

gulp.task("webpack-dev-serverWeb", function(callback) { 
var myConfig = Object.create(webpackConfig); 
new myWebpackDevServer(mywebpack(myConfig), { 
    publicPath: "/" + myConfig.output.publicPath, 
    stats: { 
     colors: true 
    } 
}).listen(8080, "localhost", function(err) { 
    if (err) throw new gutil.PluginError("webpack-dev-server", err); 
    gutil.log("[webpack-dev-server]", "http://localhost:8080/webpack-dev-server/your_path_to_index.html_for_port_8080/index.html"); 
});

来源

2016-05-20 07:29:33 AishApp

多Angular2应用，单一供应商库

回答

相关问题