鍍金池/ 問(wèn)答/網(wǎng)絡(luò)安全  HTML/ webpack打包原生js

webpack打包原生js

我要用webpack打包原生js，
然后寫(xiě)了個(gè)小demo測(cè)試一下：
我寫(xiě)了個(gè)test.js文件

module.exports = {
    alertMsg:function(){
        alert(1);
    }
}

然后在入口文件entry.js里面導(dǎo)入這個(gè)文件

'use strict';
let a = require('./home/test.js');

module.exports = {a};

下面index.html文件

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <script src="./common/jquery.min.js"></script>
    <script src="./bundle.js"></script>
</head>
<body>
    <div id="head"></div>
    <div>
        <button id="btn" onclick="alertMsg()">click</button>
    </div>
</body>
<script>
    window.alertMsg = a.alertMsg;
</script>
</html>

提示a未定義，我不知道是哪里理解出錯(cuò)，是對(duì)es6的module？！
迫切希望得到幫助。。。感謝

回答
編輯回答
陌南塵

entry.js中加一行代碼就行了
window.a = a;
a是一個(gè)模塊，不是一個(gè)全局變量，需要掛在windows上才可以。

2017年8月17日 06:01
編輯回答
枕邊人

你需要使用webpack 打包UMD模塊。

2017年3月19日 17:32
編輯回答
怣人

建議還是打好基礎(chǔ)先!
ES5 ES6濫用

2017年7月18日 06:51
編輯回答
怪痞

這....

在entry.js中, 的確有export a這個(gè)變量, 但這些都是在ES6的環(huán)境下.你可以再添加一個(gè)新的文件, 如demo.js:
let a = require('./entry.js')
然后再去使用它.

但如果像
window.alertMsg = a.alertMsg, 這么寫(xiě)肯定不對(duì)的.

2017年10月15日 20:19