Question

我一直在制作自己的JS库，并尝试使用webpack对其进行重新制作。

在我的原始文件中，我将原型函数用于变量构造函数，如下所示：

Date.prototype.fooFunc = function(e){
// return something
};
String.prototype.barFunc = function(e) {
// return something
};


var Library = function(e){
var date = new Date();

this result = date.fooFunc().barfunc();
};

和变量构造函数原型函数的代码行变得很长。因此，我试图为原型功能创建一个单独的文件。

但是我不知道如何在JS模块系统中导出预定义变量的属性。我怎么走遍它？

已解决

prototypes.js

if ( typeof Date.prototype.myFunc == undefined ) {
  var foo = new Date();
  return foo.something();
};

// no export

webpack.config.js

module.exports = (env, options) => {
  const config = {
    target: 'web',
    entry: {
      'my-library': [
        './src/prototypes.js',
        './src/index.js'
      ],
    },
    output: {
      filename: '[name].min.js',
      library: 'myLibrary',
      libraryTarget: 'var',
      libraryExport: 'default',
      path: path.resolve(__dirname, 'dist')
    },
    optimization: {
      splitChunks: {
        cacheGroups: {
          commons: {
            test: /[\\/]node_modules[\\/]/,
            name: 'vendors',
            chunks: 'all'
          }
        }
      }
    },
  }
  return config;
}

Answer 1

您不需要导出原型方法。将它们添加到对象后，它们便成为对象的组成部分，并且将始终可以访问。

您必须在扩展对象之后，在构建过程中将其用于其他地方之前，在文件中添加具有原型扩展名的文件。

如果仅扩展日期和数学之类的javascript本机对象，则将扩展文件作为您构建的第一个文件。

如何使用webpack添加变量构造函数的原型函数

已解决

1 个答案: