我最近在我的.NET Core MVC 7应用程序的构建过程中添加了WebPack 5。
我的目标是能够从WebPack在我的视图中生成的javascript文件调用我的javascript函数。
我有一个简单的Index.cshtml
文件,其中包含一个局部视图和来自webpack的生成的javascript:
索引.cshtml
<div>
@await Html.PartialAsync("SettingsTab")
</div>
@section Scripts
{
<script defer src="~/dist/settings.entry.js"></script>
}
SettingsTab
包含一个试图从settings.entry.js
文件中触发方法的按钮:
设置选项卡cshtml
<div>
<button type="button" onclick="saveProfileSettings()">Save Profile</button>
</div>
settings.js
文件beforewebpack将其捆绑到dist文件夹中,如下所示:
设置.js导入(../css/settings.css ')
函数saveProfileSettings(){ //执行操作}
当我不使用webpack时,我可以直接调用这个函数,就像我在上面尝试的那样。
但是现在当我引用捆绑的js文件时,它不能调用它。
看一下settings.entry.js
文件的结尾,webpack似乎将我的代码捆绑到了IIFE中:
设置结束.entry.js
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be in strict mode.
(() => {
"use strict";
// omitted contents of settings.js
})();
/******/ })()
;
我想指示WebPack不要这样 Package 我的代码,这样我就可以直接调用其他地方的函数。
现在我发现我可以在webpack.config.js
中使用library
,如下所示:
output: {
filename: "[name].entry.js",
path: path.resolve('wwwroot', 'dist'),
publicPath: "/dist/",
library: ['WebPack', '[name]']
},
这样我就可以成功地使用WebPack.settings.saveProfileSettings()
引用我的函数,但是我不想这样做,我想能够直接引用我的函数作为saveProfileSettings()
。
如何更改WebPack打包代码的方式以执行此操作?
1条答案
按热度按时间hgb9j2n61#
您可以将寿命设置为
false
: