htmlファイルでbundle.jsの機能が表示されないのはなぜですか？

Question

webpackとスタックを開始します。私の生成されたhtmlファイルは、イベントonclickで文字列で構成されています。しかし、私のHTMLファイルdoest'tは、生成されたファイルbundle.jsで機能を参照してください。 jsファイルが正常にバンドルされました（console.logが機能します）。しかし、もし私が<script>function bar()...</script>をhtmlで書くと、onclickが動作します。助けて。 接続ファイルを先頭に、試しに本文を、試しに本体/ファイルの最後に - 機能が表示されません。 main.jsから生成さBundle.js：HTMLで

require("path to css..."); 
function bar(){...}; 

文字列：

<div class="foo" onclick="bar()">...</div> 

Bundle.js：あなたはあなたの関数をエクスポートしていないためだ

var HtmlWebpackPlugin = require('html-webpack-plugin'); 
var ExtractTextPlugin = require("extract-text-webpack-plugin"); 

module.exports = { 
    entry: "./src/main.js", 
    output: { 
    path: "dist", 
    filename: "bundle.js" 
}, 

module: { 
    loaders: [ 
    { 
     test: /\.js$/, 
     loader: "babel-loader", 
     options: { presets: ["es2015"] } 
    , 
    { 
     test: /\.css$/, 
     loader: ExtractTextPlugin.extract('style','css') 
    }, 
    { 
     test: /\.jade$/, 
     loader: "jade" 
    }] 
}, 
plugins: [ 
    new ExtractTextPlugin("main.css"), 
    new HtmlWebpackPlugin({ 
     template: './src/jade/index.jade' 
    }) 
] 
}; 

Answer 1

。 WebPackの主な利点の1つは、機能がデフォルトでグローバルスコープに置かれないことです。宣言にexport defaultを追加してください。

export default function bar(){...};