webpack-pug js函数不是函数

Question

我是 webpack 和 pug 的新手。做一个小任务和

我在 drop.js 中写了一个函数 dropDown() 并将其导出到 index.js 文件中，
试图将其放入 PUG 文件中但是：
控制台写入 'function is not defined' 或 f'函数不是函数'。
谁能帮我解决这个问题，正确定义 js 函数

这是 link 我的 webpack.config enter link description here

这是我的 json 文件 enter link description here

在 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 时遇到这个错误enter image description here

Answer 1

尝试分配函数而不调用它。

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');
    }
  }
}

Answer 2

多亏了史蒂文，我终于做了一些改变来解决了一个问题。在 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()'

webpack-pug js函数不是函数

webpack-pug js function is not a function

javascript

webpack

pug