Webpack：在不使用ProvidePlugin和Expos-loader的情况下公开全局变量

我在这个ReactJS项目中工作，并且我有一个读取子文件夹package.json的要求，将它们全部安装到node_modules中，之后安装所有依赖项将它们添加到全局变量，以便它们可以在代码中的任何地方使用。Webpack：在不使用ProvidePlugin和Expos-loader的情况下公开全局变量

问题是，我没有访问到由于来自webpack.config.js（我需要动态地添加它们）的语法的公开加载器上的jsons，所以相反，我创建了一个加载器测试package.json，获取依赖关系并尝试复制expose-loader行为。

这是

var toCamelCase = function(str) { 
    return str.toLowerCase() 
    .replace(/[-_]+/g, ' ') 
    .replace(/[^\w\s]/g, '') 
    .replace(/ (.)/g, function($1) { return $1.toUpperCase(); }) 
    .replace(/ /g, ''); 
} 

var returning_string = function(dependencies_object){ 
    var final_string = ""; 
    Object.keys(dependencies_object).map(function(dependency){ 
     var location = require.resolve(dependency); 
     var export_dependency = 'module.exports = global["'+toCamelCase(dependency)+'"] = require("-!'+ location+'");'; 
     final_string += export_dependency; 
    }) 
    return final_string; 
}; 

module.exports = function() {}; 
module.exports.pitch = function(e){ 
    if(this.cacheable) {this.cacheable();} 
    var dependencies = require(e).dependencies; 
    return returning_string(dependencies); 
};

的问题是，即使输出是完全一样的一些原因，那么在使用时暴露装载它的工作库添加到全球范围内。在做这两件事情时，我手动添加了依赖项以提供插件，我将稍后需要以某种方式进行复制。

有没有更好的方法来做到这一点？或者我做对了，但我失去了一些东西？

来源

2016-11-29 Berto

您是否找到解决方案？我有着同样的问题。你最终使用不同的打包机？ – user1828780

研究后，我发现了following中的WebPack 2.x的（我用的WebPack 1.x的，但我想的是哲学史的有效期为我的版本）有关配置文件说：

写和执行函数来生成配置的一部分

所以我对这个问题的方法是不使用新的插件，但重用应该工作的。基本上我写了一个新的JavaScript文件，以webpack.config的方式创建我需要的所有加载器。

这是文件：

dependencies_loader.js https://gist.github.com/abenitoc/b4bdc02d3c7cf287de2c92793d0a0b43

这是aproximately我叫它方式：

var webpack = require('webpack'); 
var dependency_loader = require('./webpack_plugins/dependencies_loader.js'); 


module.exports = { 
    devtool: 'source-map', 
    entry: {/* Preloading */ }, 
    module: {preLoaders: [/*Preloading*/], 
    loaders: [/* Call all the loaders */].concat(dependency_loader.getExposeString()), 
    plugins: [ 
    new webpack.ContextReplacementPlugin(/package\.json$/, "./plugins/"), 
    new webpack.HotModuleReplacementPlugin(), 
    new webpack.ProvidePlugin(Object.assign({ 
     '$': 'jquery', 
     'jQuery': 'jquery', 
     'window.jQuery': 'jquery' 
    }, dependency_loader.getPluginProvider())), // Wraps module with variable and injects wherever it's needed 
    new ZipBundlePlugin() // Compile automatically zips 
]

请注意，我Concat的装载机的阵列加入以下需要的getExposeString（）加载器，并使用getPluginProvider将对象与pluginProvider中的新全局元素重新分配。也因为我使用jsHint我排除全局名称，这是为什么其他方法。

这只能解决node_modules依赖关系，如果您需要本地库，则有不同的方法。

来源

2016-12-07 17:44:32 Berto

Webpack：在不使用ProvidePlugin和Expos-loader的情况下公开全局变量

回答

相关问题