Angular4 + MVC + cli + 使用从 cli build 命令生成的 dist 文件夹进行部署

Posted 2023-02-19

【中文标题】Angular4 + MVC + cli + 使用从 cli build 命令生成的 dist 文件夹进行部署

【英文标题】：Angular4 + MVC + cli + deployment using dist folder generated from cli build command

【发布时间】：2019-04-06 12:47:10

【问题描述】：

我有一个 angular4 + MVC 项目。

我生成了一个 dist 文件夹 通过 cli 中的ng build --prod 命令进行角度分析。

我想删除 node 模块，并且只签入这些 dist 文件以进行生产。

我的问题是如何使用/dist 文件夹而不是/node 模块 来开始执行。

目前我正在使用我的 layout.cshtml(in mvc) 中的 system.import() 来导入 angular 的应用程序模块。

 <script>
System.import('app/main.js').catch(function (err)  console.error(err); );

systemjs.config 文件中的内容应该是什么，因为我的目的是消除节点模块，目前** systemjs.config ** 指向打开节点模块文件夹。

(function (global) System.config(
paths: 
  'npm:': 'node_modules/'
,
map: 
  'app': 'app',
  '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
  '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
  '@angular/animations': 'npm:@angular/animations/bundles/animations.umd.js',
  '@angular/animations/browser': 'npm:@angular/animations/bundles/animations-browser.umd.js',
  '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
  '@angular/platform-browser/animations': 'npm:@angular/platform-browser/bundles/platform-browser-animations.umd.js',

等等。等等

任何帮助将不胜感激。

【问题讨论】：

本指南帮助了我：linkedin.com/pulse/…

正是哈里尼。就是这样。您可以将其发布为答案:)

【参考方案1】：

这一切都与您的构建中的 index.html 有关 - 它包含您所有的脚本部分和 polyfills

只需将您的 index.html 从 dist 文件夹添加到您的 cshtml 文件，并将您的脚本和样式映射到您的构建文件夹

您只需要部署您的 prod 构建，仅此而已 - 您可以排除您的节点模块并签入您的更改

谢谢！！快乐编码

【讨论】：

感谢您的帮助，尽管我之前找到了解决方案并且它对我有用。 1）我运行ng build命令在dist文件夹中生成节点文件和启动文件。 2）从项目中删除节点模块 3）在 cshtml 文件中添加一个指向 dist 文件夹中所有文件的包 / 或简单地将 dist 文件夹中文件的所有引用单独添加到 cshtml 文件。运行代码，一切正常