爲什麼html文件在bundle.js中看不到功能？

Question

開始使用webpack和堆棧。我生成的HTML文件包含事件onclick的字符串。但是我的html文件沒有在生成的文件bundle.js中看到函數。捆綁JS文件成功（console.log工程）。但如果我在html中寫入<script>function bar()...</script>，請點擊工作。幫幫我。 嘗試連接文件在頭部，開始的身體，身體/文件的結尾 - 看不到功能。從main.js產生Bundle.js：

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

字符串中的html：

<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的一個主要優點是默認情況下函數不會放在全局範圍內。將export default添加到您的聲明中：

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