javascript - Webpack打包UMD的问题
伊谢尔伦
伊谢尔伦 2017-04-11 09:56:24
[JavaScript讨论组]

webpack把es6写的library打包成一个UMD文件,使用global var的方式来调用这个打出来的bundle(ukulele.js)会出现一个很奇怪的问题:
比如我<script src="ukulele.js"></script>后
我必须使用Ukulele.Ukulele才能真正调用到function,外面会被包裹一层叫Ukulele属性。。。我们明明export的是一个function啊。。。请知道的朋友们解答,如何才能直接可以new Ukulele()呢 而不是 new Ukulele.Ukulele()

entry 如下 (es6)

function Ukulele(){
    //balabala
}
export {Ukulele}

webpack-config.js如下

var webpack = require('webpack');
var path = require('path');
var libraryName = 'Ukulele';

var config = {
    entry: __dirname + '/src/ukulele/core/Ukulele.js',
    devtool: 'source-map',
    output: {
        path: __dirname + '/dist',
        filename: 'ukulele.js',
        library: libraryName,
        libraryTarget: 'umd',
        umdNamedDefine: true
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: 'babel',
                exclude: /(node_modules|bower_components|test)/,
                query: {
                    presets: ['es2015']
                }
             },
        ]
    },
    resolve: {
        root: path.resolve('./src'),
        extensions: ['', '.js']
    }
}
module.exports = config;
伊谢尔伦
伊谢尔伦

小伙看你根骨奇佳,潜力无限,来学PHP伐。

全部回复(2)
大家讲道理

自己搞定了,不要设置libraryName就行了

output: {
        path: __dirname + '/dist',
        filename: 'ukulele.js',
        library: libraryName,   //不要设置libraryName就行了
        libraryTarget: 'umd',
        umdNamedDefine: true
    },
黄舟

但是,你这样在node中使用的时候,需要 require('xxx'). Ukulele 才能用啊,,

有木有什么方法,可以让module挂在global,而且在node中也可以直接require呢

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号