多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
我希望能够利用根应用的资源,而不是需要复制的代码。
答
这样做的一种方法是使用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"); });
什么是你angular2版本?你如何打包你的资产?我有'webpack'的设置,如果你有兴趣,我会发布它。 – Abdulrahman
我正在使用'System.js'并运行最新版本的Angular。 –
我想你需要使用'gulp'来捆绑'SystemJS'资源。我没有自己做,但[检查此答案](http://*.com/a/34616199/3125880)。他还使用'jspm'。这与你需要的基本相同,你只需要修改目的地。 – Abdulrahman