Question

我在index.js中有一个带有函数start（）的导出模块，我想在我的HTML的body标签中调用<body onload='App.start();'>

这是一个类似的问题我的答案我已尝试过：Calling webpacked code from outside (HTML script tag)

以下是来自项目的代码：https://github.com/zv/tree <body onload="ZVTree.draw();">

require('babel-polyfill');
var path = require('path');
var dir_js = path.resolve(__dirname, 'src');
var dir_build = path.resolve(__dirname, 'build');

module.exports = {
    entry: path.resolve(dir_js, 'main.js'),
    output: {
        libraryTarget: 'var',
        library: 'ZVTree',
        path: dir_build,
        filename: 'zv-tree.js'
    },
    module: {
        loaders: [
            {
                loader: 'babel-loader',
                test: dir_js,
            }
        ]
    },
    // Create Sourcemaps for the bundle
    devtool: 'source-map',
    devServer: {
        contentBase: dir_build,
    }
};

这是我的代码，其中index.js被截断： index.js：

module.exports = {

  start: function(){
    console.log('hey')
    intializeVariables()
    addListeners()

  }}

的index.html：

    <script type='text/javascript' src='dist/bundle.js'></script>
</head>
<body onload = "App.start();">
<div id ='mainContainer'>

webpack.config.js：

module.exports = {
    entry: './index.js',
    output: {
        libraryTarget: 'var',
        library:'App',
        path: './dist',
        filename: 'bundle.js'
    },
    module: {
        loaders: [
            { test: /\.js$/, loader: 'babel', exclude: /node_modules/ }
        ]
    }

}

每次我在浏览器中运行项目时都会收到错误：未捕获的ReferenceError：App应该作为库公开时未定义，如果我将整个内容放在脚本标记中而不是身体。非常感谢任何帮助或想法。

从HTML中的window.onload调用webpacked代码

0 个答案: