关键词：
【中文标题】Webpack - 在 Angular 2 中调用外部 JS【英文标题】：Webpack - Call external JS in Angular 2 【发布时间】：2017-02-01 23:16:09 【问题描述】：我希望从 systemJS 换成 webpack。除了让我的一个外部脚本再次运行之外，大多数设置似乎都在工作。
以前使用 systemJS 我有一个设置，我将在我的 index.html 中导入一个外部 .js 脚本。
在我的角度服务中，我可以通过执行以下操作与该脚本进行交互 -
declare var ExternalCode: any;
.
.
.
ExternalCode.RunProcess(data, infomation);
在 webpack 中，我现在有 3 个文件被导出并注入到我的 index.html 中——app.js、vendor.js 和 polyfills.js。在我的供应商文件中，我像这样导入代码，
import "./AppScripts/ExternalCode";
如果我再查看 vendor.js，我会看到我的 ExternalCode 是这样包装的，
(function(module, exports, __webpack_require__)
eval( EXTERNAL CODE IS ALL HERE );
)
我似乎无法理解的是我现在如何从我的服务中的 webpack vendor.js 包中调用我的外部代码。无论如何现在可以从我的 Angular 2 服务中导入/运行代码？
我也尝试过在 index.html 文件中再次导入脚本，但是在 webpack-dev-server 上，当我使用 IIS Express 运行项目时，它总是会从用于工作的现有路径抛出 404和 SystemJS。
【问题讨论】：
为什么不试试angular-cli？它会为你处理所有的webpack ceremony。
【参考方案1】：
想出了如何使它像以前使用 SystemJS 一样工作。在上面提到的 vendor.ts 中导入脚本，使其包含在 webpack-dev-server 中。
import "./externaljs/ExternalCode.js";
不要将导入视为在 index.html 的相对位置，只需像这样传递完整路径 -
<script src="./src/externaljs/ExternalCode.js"></script>
【讨论】：
未捕获的 ReferenceError：在 Angular 2 webpack 全局库安装中未定义要求
】未捕获的ReferenceError：在Angular2webpack全局库安装中未定义要求【英文标题】：UncaughtReferenceError:requireisnotdefinedonAngular2webpackgloballibraryinstallation【发布时间】：2017-03-0321:17:24【问题描述】：我是Angular2的新手。我在Angular2项目中使... 查看详情
在特定的 Docker 容器环境中配置 Angular 2 Webpack App
】在特定的Docker容器环境中配置Angular2WebpackApp【英文标题】：configureAngular2WebpackAppinDockercontainerenvironmentspecific【发布时间】：2017-03-1518:20:56【问题描述】：我们希望使用Docker映像在不同的环境（暂存/测试、生产...）中部署我们... 查看详情
在 .Net Core 2.0 和 Angular 中使用“dotnet publish”时找不到模块“aspnet-webpack”
...etCore2.0和Angular中使用“dotnetpublish”时找不到模块“aspnet-webpack”【英文标题】：Cannotfindmodule\'aspnet-webpack\'whenusing\'dotnetpublish\'in.NetCore2.0&Angular【发布时间】：2018-04-0507:49:58【问题描述】：我一直在尝试遵循此问题的答案，但... 查看详情
webpack服务器中的rest API调用（来自角度）返回401
】webpack服务器中的restAPI调用（来自角度）返回401【英文标题】：restAPIcall(fromangular)inwebpackserverreturns401【发布时间】：2018-02-0313:10:39【问题描述】：Angular应用，（在webpack开发服务器中执行），它对部署在JETTY中的Spring应用程序... 查看详情
使用 Angular 在 Webpack 中定义 metisMenu
】使用Angular在Webpack中定义metisMenu【英文标题】：DefinemetisMenuinWebpackusingangular【发布时间】：2017-09-2511:28:55【问题描述】：我使用“jhipster”创建了项目，它是Angular4项目。它使用Webpack和“纱线”。我为我的要求安装了metisMenu，... 查看详情
TS2304：在 Webpack / Angular 2 中找不到名称“描述”
】TS2304：在Webpack/Angular2中找不到名称“描述”【英文标题】：TS2304:Cannotfindname\'describe\'inWebpack/Angular2【发布时间】：2017-07-2809:26:13【问题描述】：我已经广泛搜索了这个问题，但没有找到任何解决方法。我正在尝试使用webpack运... 查看详情
在 webpack 中使用 angular-ui-bootstrap
】在webpack中使用angular-ui-bootstrap【英文标题】：Usingangular-ui-bootstrapwithwebpack【发布时间】：2016-12-0900:28:34【问题描述】：我尝试在Webpack中使用https://github.com/angular-ui/bootstrap：importangularfrom\'angular\';importuiRouterfrom\'angular-ui 查看详情
在 Angular 2 中使用 Jquery 函数调用
】在Angular2中使用Jquery函数调用【英文标题】：UsingJqueryfunctioncallwithAngular2【发布时间】：2020-05-1909:16:16【问题描述】：我正在尝试在我的Angular2应用程序上使用这个convFormjquery插件。我已成功将jquery和convForm安装到我的项目中，... 查看详情
在 Angular2+Webpack 中使用 templateUrl 的相对路径
】在Angular2+Webpack中使用templateUrl的相对路径【英文标题】：UsingrelativepathfortemplateUrlinAngular2+Webpack【发布时间】：2016-08-1706:18:06【问题描述】：importComponentfrom\'angular2/core\';@Component(selector:\'app\',styleUrls:[\'./app.component.l 查看详情
angular2-webpack-starter 如何将 NodeJS 服务器添加到项目中
】angular2-webpack-starter如何将NodeJS服务器添加到项目中【英文标题】：angular2-webpack-starterhowtoaddNodeJSservertoproject【发布时间】：2017-03-0312:23:06【问题描述】：我克隆了一个angular2-webpack-starter项目，它运行良好；现在我想为这个项目... 查看详情
如何在 angular2-webpack 中导入“stompjs/lib/stomp.min”
】如何在angular2-webpack中导入“stompjs/lib/stomp.min”【英文标题】：Howtoimport"stompjs/lib/stomp.min"inangular2-webpack【发布时间】：2016-10-0503:33:10【问题描述】：我有一个angular2-webpack应用，想要实现stomp、sockjs-client、websocket。已添... 查看详情
如何在 Angular 2 应用程序上使用 webpack 进行代码拆分？
】如何在Angular2应用程序上使用webpack进行代码拆分？【英文标题】：HowdoIdocodesplittingwithwebpackonangular2app?【发布时间】：2017-02-0507:48:46【问题描述】：我有一个这样的应用结构：├──/dashboard│├──dashboard.css│├──dashboard.ht... 查看详情
在 Angular 应用程序中动态包含另一个 webpack 包
】在Angular应用程序中动态包含另一个webpack包【英文标题】：dynamicallyincludeanotherwebpackbundleinsideanangularapplication【发布时间】：2017-08-2910:23:27【问题描述】：我正在开发一个与webpack捆绑在一起的Angular2应用程序。一切正常。然而，... 查看详情
将引导程序添加到 angular2-seed 项目的 webpack 包中
】将引导程序添加到angular2-seed项目的webpack包中【英文标题】：Addingbootstraptowebpackbundleofangular2-seedproject【发布时间】：2017-03-2110:58:56【问题描述】：我想在这个Angular2种子项目中使用引导程序：https://github.com/angular/angular2-seed我怎... 查看详情
在 Angular2 和 Webpack 中使用 CDN 文件
】在Angular2和Webpack中使用CDN文件【英文标题】：UsingCDNfileswithAngular2andWebpack【发布时间】：2016-04-2511:53:11【问题描述】：所以我想知道是否有办法在webpack包中包含CDN文件。我一直在环顾四周，在尝试设置一个不会引发Typescript转... 查看详情
延迟加载模块中的 Angular single-spa 延迟加载路由调用未定义的 webpack 错误
...迟加载模块中的Angularsingle-spa延迟加载路由调用未定义的webpack错误【英文标题】：Angularsingle-spalazyloadedroutesinlazyloadedmodulesgivecallofundefinedwebpackerror【发布时间】：2020-04-0520:56:33【问题描述】：我使用带角度的单水疗中心。我有一... 查看详情
webpack html-loaders 小写 angular 2 内置指令
】webpackhtml-loaders小写angular2内置指令【英文标题】：webpackhtml-loaderslowercaseangular2built-indirectives【发布时间】：2017-03-3007:11:05【问题描述】：我正在使用html-loader来加载我的html模板和file-loader来加载我在模板中的图像。这在dev中运... 查看详情
JSPM 与 Angular 2 的 WebPack
】JSPM与Angular2的WebPack【英文标题】：JSPMvsWebPackforAngular2【发布时间】：2017-03-0811:04:08【问题描述】：最近我在我的Angular2项目中使用了JSPM，发现它使用起来非常简单方便。无论是添加新模块还是创建用于生产的捆绑包。基本上... 查看详情