我是 webpack 和 pug 的新手。從事一項小任務和
- 我在 drop.js 中寫了一個函式 dropDown() 將它匯出到 index.js 檔案中，
- 試圖把它放在 PUG 檔案中，但是：
- 控制臺寫入“函式未定義”或“函式不是函式”。
- 請任何人都可以通過正確定義js函式來幫助我解決該問題
這是我的 webpack.config 的 鏈接 在此處輸入鏈接描述
這是我的 json 檔案 在此處輸入鏈接描述
在 PUG 檔案中，我使用這樣的函式：
.searchbox-drop
button(href="#" data-dropdown='drop1' onclick='dropDown()' aria-controls='drop1' aria-expanded=false class='dropbtn') Вce
image('triangle','searchbox-drop__icon' )
在 index.js 中
import $ from "jquery";
import 'bootstrap';
import './styles/index.scss';
import {dropDown} from './drop.js';
window.dropDown = dropDown();
在 drop.js 中
export function dropDown(){
function show() {
document.getElementById('myDropdown').classList.toggle('show');
}
//close dropdown id the user cliks outside of it
window.onclick = function(e){
if(!e.target.matches('.dropbtn')){
var myDropdown = document.getElementById('myDropdown');
if(myDropdown.classList.contains('show')){
myDropdown.classList.remove('show');
}
}
}
}
這是 CONFIG 檔案中 PUG 插件的一部分：
new HtmlWebpackPlugin({
filename: 'index.pug' ,
minify: false,
scriptloading:'blocking',
inject:'body'
}),
new HtmlWebpackPugPlugin()
這是 index.pug
include pug/libs/_libs
include pug/_mixins
doctype html
html(lang='en')
include pug/_head
body
include pug/_header
block content
我不知道我做了什么，但現在我什至在點擊 btn 時出現這個錯誤，在此處輸入圖片描述
uj5u.com熱心網友回復：
嘗試分配函式而不呼叫它。
window.dropDown = dropDown;
或許這就是你想要的……
export function dropDown() {
document.getElementById('myDropdown').classList.toggle('show');
}
//close dropdown id the user clicks outside of it
window.onclick = function(e){
if(!e.target.matches('.dropbtn')){
var myDropdown = document.getElementById('myDropdown');
if(myDropdown.classList.contains('show')){
myDropdown.classList.remove('show');
}
}
}
uj5u.com熱心網友回復：
感謝史蒂文，我終于做了一些改變來解決問題。在 index.js 中它是這樣的：
import $ from "jquery";
import 'bootstrap';
import './styles/index.scss';
import {show} from './drop.js';
window.show= show;
window.onclick = function(e){
if(!e.target.matches('.dropbtn')){
var myDropdown = document.getElementById('myDropdown');
if(myDropdown.classList.contains('show')){
myDropdown.classList.remove('show');
}
}
}
在 index.pug 中：
onclick = 'show()'
轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/400850.html
標籤：javascript 网络包 哈巴狗