현재 웹 애플리케이션을 개발 중이며 WebPack에 번들로 제공되도록 코드를 리팩토링하는 중입니다. 내 HTML에서HTML 파일에서 번들로 제공되는 javascript (webpack 사용)의 기능에 액세스합니다.
나는 클릭 할 때 sendMessage()
함수를 호출하는 버튼, 내 코드의 첫 번째 버전에서
<button type="button" class="btn btn-default" onclick="sendMessage(document.getElementById('claim').value)">Submit</button>
가의 sendMessage()
기능이 나는 HTML에서 직접 가져온 .js
파일에 정의되어 있습니다 ,
<script src="my_js/newsArticleScript.js"></script>
및 SendMessage() 함수는 직접 어떤 클래스 또는 모듈 내부 아니라, 파일 선언하지만 다른 함수 D를 호출한다 같은 파일에 efined, 그래서 그것을 분리하고 싶지 않아요.
하지만 이제 WebPack에 번들됩니다.
const path = require('path')
module.exports = {
entry: {
\t homepage: './src/homepageScript.js',
\t newspage: './src/newsArticleScript.js'
},
output: {
filename: '[name].bundle.js',
path: path.resolve(__dirname, 'dist/my_js')
}
}
homepageScript.js
다른 페이지입니다)입니다. 내가 버튼을 누를 때 그리고 지금, 나는 그것에 대해 읽은
[Error] ReferenceError: Can't find variable: sendMessage
오류를 얻을, 나는 웹팩은 전 세계적으로 기능을 노출하지 않습니다 것을 배웠다. 함수를 내보내려고했지만 동일한 오류가 계속 발생했습니다.
아무도 도와 줄 수 있습니까? 본질적으로 내가 필요로하는 것은 webpack을 구성하거나 JS에서 HTML로 액세스 할 수 있도록 JS를 변경하는 방법을 이해하는 것입니다.
나는 JS에 익숙하다. 그래서 내 앱이 설계된 방식이 최선이 아니므로 개선점에 대한 조언 (모듈을 사용해야 할 수도 있고, JS 기능을 클릭 할 때 더 나은 방법이있을 수도있다. 버튼)도 환영받을 것입니다. 고마워요 :)
고마워요! 그냥 옵션 1을 시도하고 즉시 작업 :) 옵션 2 나중에 시도합니다. – jsantos