我的alertHi.js
将被加载,但我不能从主题使用它。
JS源警报Hi.js:
这个(inc/Components/Darkmode/src/alertHi.js
)将在我加载页面时执行:
function alertHi(){ alert('hi') }
alertHi();
console.log('is loaded');
但是
html-源代码
<a onclick="alertHi()">☀️</a>
会产生此错误:
错误:未定义alertHi
但是如果我从页面调用函数alertHi()
,我会得到错误:
Uncaught ReferenceError: alertHi is not defined
onclick http://localhost/wordpress/:1
你知道吗?
JS-最小源距离/警报最小值js:
webback已生成dist/alertHi.min.js
/******/ (() => { // webpackBootstrap
/******/ // The require scope
/******/ var __webpack_require__ = {};
/******/
/************************************************************************/
/******/ /* webpack/runtime/make namespace object */
/******/ (() => {
/******/ // define __esModule on exports
/******/ __webpack_require__.r = (exports) => {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/ })();
/******/
/************************************************************************/
var __webpack_exports__ = {};
// This entry need to be wrapped in an IIFE because it need to be isolated against other entry modules.
(() => {
/*!*************************************************!*\
!*** ./inc/Components/Darkmode/src/alertHi.js ***!
\*************************************************/
function alertHi() {
alert('alertHi says hello :)');
}
alertHi();
console.log('script loaded');
})();
// This entry need to be wrapped in an IIFE because it need to be in strict mode.
(() => {
"use strict";
/*!***************************************************!*\
!*** ./inc/Components/Darkmode/src/alertHi.scss ***!
\***************************************************/
__webpack_require__.r(__webpack_exports__);
// extracted by mini-css-extract-plugin
})();
/******/ })()
;
//# sourceMappingURL=alertHi.min.js.map
之前正在阅读:
- Cannot call javascript function in wordpress
- Hiding Javascript Function File from WordPress Theme Footer
并尝试在此处读取提示Cannot call javascript function in wordpress
但得到错误jQuery未定义
也将不会被发现,如果我使用
(function($) {
function alertHi(){
alert('hi')
}
})(jQuery);
2条答案
按热度按时间ndh0cuux1#
webpack默认情况下在内部 Package 所有的bundle,你不能从外部访问它,除非在webpack配置中明确地将它设置为一个库。你也可以把它砍下来,并在你的js代码中添加
window.alertHi = alertHi
,但这是不推荐的。请参考Webpack配置API,并将捆绑包输出设置为库。(最好是- UMD/commonjs库)
rjee0c152#
受到下面这个问题的答案(Define global variable with webpack)和这里这个答案https://stackoverflow.com/a/35825562/2891692的启发,我找到了一个解决方案:
使用全局窗口对象