webpack - imports-loader和ProvidePlugin：相似但不一样？

以下是我有：webpack - imports-loader和ProvidePlugin：相似但不一样？

a.js

$(() => { 
    $.x = 42; 
    console.log('hello from a'); 
});

b.js

$(() => { 
    console.log($.x); 
    console.log('hello from b'); 
});

的index.html

<!DOCTYPE html> 
<meta charset="utf-8"> 
<body> 
<script src="/vendor.js"></script> 
<script src="/a.js"></script> 
<script src="/b.js"></script>

我的问题是，下面的两个webpack配置是否达到完全相同的结果？

[1] webpack.config.js（与进口装载机）

const config = { 
    entry: { 
    a: './a.js', 
    b: './b.js', 
    vendor: [ 
     'jquery', 
    ], 
    }, 
    module: { 
    rules: [ 
     { 
     test: /(a|b)\.js$/, 
     use: 'imports-loader?$=jquery', 
     }, 
    ], 
    }, 
};

[2] webpack.config.js（与ProvidePlugin）

const config = { 
    entry: { 
    a: './a.js', 
    b: './b.js', 
    vendor: [ 
     'jquery', 
    ], 
    }, 
    plugins: [ 
    new webpack.ProvidePlugin({ 
     $: 'jquery', 
    }), 
    ], 
};

如果它们是什么时候相似但不一样？

此外，在b.js,$.x等于undefined，这是否意味着$引用了不同的jQuery对象？如果是这样，我该如何让它们引用相同的（全局）jQuery实例？

来源

2017-05-08 Glenn Mohammad

imports-loader只在运行父装载器时才引入导入。（在你的情况下，只在js文件上。）导入的文件被“附加”到父级。

ProviderPlugin导入到“全局”名称空间中，使得您在任何地方导入的任何内容都可用。它通常用于像jquery这样的独立库。

相似，但不相同。

来源

2017-05-08 17:14:32 Quotidian

webpack - imports-loader和ProvidePlugin：相似但不一样？

回答

相关问题