相关疑难解决方法(0)

我正在尝试使用webpack(http://webpack.github.io/)并且它看起来非常好,但是我有点被困在这里.

假设我正在使用CDN作为库,f.ex jQuery.然后在我的代码中,我希望require('jquery')自动指向全局jquery实例,而不是尝试从我的模块中包含它.

我尝试过使用类似的插件IgnorePlugin:

new webpack.IgnorePlugin(new RegExp("^(jquery|react)$"))

这适用于忽略库,但它仍然表示当我运行webpacker时所需的模块"丢失".

不知怎的,我需要告诉webpack jquery应该从全局上下文中获取.看起来像一个常见的用例,所以我很惊讶文档没有具体针对这一点.

我正在尝试排除webpack生成的bundle的反应.原因是,我们在页面上有一个全局版本的反应,所以我将使用它.

我已尝试使用下面的内容,如此处建议的Webpack和外部库,但这似乎不起作用.我可以看到webpack已经导出了React但它仍然出现在bundle中.

externals: {
  'react': 'React'
}

我在想它可能是另一个依赖,例如反应路由器导入反应？有没有人设法做到这一点？

我有一个可以与node.js和浏览器一起使用的库.我正在使用CommonJS然后使用webpack发布Web版本.我的代码看起来像这样:

// For browsers use XHR adapter
if (typeof window !== 'undefined') {
  // This adapter uses browser's XMLHttpRequest
  require('./adapters/xhr');
}
// For node use HTTP adapter
else if (typeof process !== 'undefined') {
  // This adapter uses node's `http`
  require('./adapters/http');
}

我遇到的问题是,当我运行webpack(browserify会做同样的事情)时,生成的输出包括http它的所有依赖项.这会导致HUGE文件对浏览器性能不是最佳的.

我的问题是如何在运行模块捆绑器时排除节点代码路径？我通过使用webpack的externals暂时解决了这个问题,并在包含时返回undefined './adapters/http'.这并不能解决其他开发人员使用CommonJS依赖我的库的用例.他们的构建最终会遇到同样的问题,除非他们使用类似的排除配置.

我看过使用envify,只是想知道是否还有其他/更好的解决方案.

谢谢!

嗨,我目前正在使用webpack将我的项目文件捆绑到一个文件中.但是,我不希望webpack捆绑我的config.js文件,其中所有配置都已设置.我想在输出文件夹中保持单独但不确定是否实现此目的.

我目前的设置是

//index.js file
#!/usr/bin/env node
'use strict';
let config = require('config.js);
let read = require('read.js);
console.log('i am running through command line');

//read.js file
'use strict'
console.log('read a text file');

//config.js 
'use strict';
module.exports = {
name: 'test'
}

//webpack.config.js
let webpack = require('webpack');
let path = require('path');
let fs = require('fs');

let nodeModules = {};
fs.readdirSync('node_modules')
.filter(function (x) {
    return [ '.bin' ].indexOf(x) === -1;
})
.forEach(function (mod) {
    nodeModules[mod] = 'commonjs ' + mod;
});

module.exports = { …

使用自定义 Angular Builder，我尝试将整个模块排除在缩小/优化之外。

Webpack.md文件说

类型
：String|RegExp|Array 默认值：undefined

要排除的文件。

我可以使用此设置来排除整个目录（即节点模块）吗？

当前的代码是

export default class CustomizeTerserBrowserBuilder extends BrowserBuilder {
  public buildWebpackConfig(root: any, projectRoot: any, host: any, options: any): any {
    const webpackConfig = super.buildWebpackConfig(root, projectRoot, host, options);

    if (
      webpackConfig.optimization &&
      webpackConfig.optimization.minimizer &&
      Array.isArray(webpackConfig.optimization.minimizer)
    ) {
      const terserPlugin = (webpackConfig.optimization.minimizer as any[]).find(
        minimizer => minimizer instanceof TerserPlugin
      );

      if (terserPlugin) {
        terserPlugin.options.exclude = [/node_modules/];
      }
    }

    return webpackConfig;
  }
}