13
Tôi có một trang HTML cơ bản với một nút:webpack cơ bản không làm việc cho chức năng nút bấm - của router lỗi tham khảo: undefined
<!DOCTYPE html>
<html lang="en">
<head>
...
</head>
<body>
<button id="button" onclick="uclicked()">Click me</button>
<script src="./bundle.js"></script>
</body>
</html>
và một app.js:
//(function(){
console.log('started up')
function uclicked(){
console.log('You clicked');
}
//})();
webpack được cài đặt và webpack --watch thành công. Các webpack.config.js là:
module.exports={
entry: './app.js',
output: {
path: __dirname,
filename: 'bundle.js'
}
}
Khi tôi tải trang console.log đang làm việc nhưng khi tôi nhấn nút tôi nhận được Uncaught ReferenceError: uclicked is not defined.
Nếu tôi thay thế <script src="./bundle.js"></script> bằng <script src="./app.js"></script> và bỏ qua webpack nút bấm tốt. Tại sao thiết lập webpack cơ bản này không hoạt động?
'uclicked' tham chiếu đến một chức năng toàn cầu, nhưng webpack theo mặc định sẽ bọc' bundle' của bạn trong một iife, bảo vệ phạm vi toàn cầu. Sử dụng 'addEventListener' trong mã của bạn hoặc hiển thị ứng dụng của bạn dưới dạng đối tượng công khai bằng cách sử dụng' trình tải tiếp xúc 'https://github.com/webpack/expose-loader –