当前位置: 首页 > 面试题库 >

webpack动态模块加载器按需

长孙淳
2023-03-14
问题内容

好的,我已经搜索了高低位,但是无法可靠地确定Webpack是否可行。

https://github.com/webpack/webpack/tree/master/examples/require.context
似乎表明可以将字符串传递给函数并加载模块…

但是我的尝试没有用:webpack.config.js

'use strict';
let webpack     = require('webpack'),
    jsonLoader  = require("json-loader"),
    path        = require("path"),
    fs          = require('fs'),
    nodeModules = {};

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


let PATHS = {
    app: __dirname + '/src'
};

module.exports = {
    context: PATHS.app,
    entry: {
        app: PATHS.app+'/server.js'
    },
    target: 'node',
    output: {
        path: PATHS.app,
        filename: '../build/server.js'
    },
    externals: nodeModules,
    performance: {
        hints: "warning"
    },
    plugins: [
        jsonLoader
    ],
    resolve: {
        modules: [
            './node_modules',
            path.resolve(__dirname),
            path.resolve(__dirname + "/src"),
            path.resolve('./config')
        ]
    },
    node: {
        fs: "empty"
    }
};

server.js

let _ = require('lodash');
let modules = [ "modules/test" ];

require( 'modules/test' )();

_.map( modules, function( module ){
    require( module );
});

modules /模块中名为test.js的模块

module.exports = () => {
    console.log('hello world');
};

但是结果始终是相同的… pm2日志只是向静态需求打个招呼世界…但是对于同一个模块的动态负载

错误:找不到模块“。”

我要做的就是循环遍历模块的路径数组并加载然后…


问题答案:

您不能将变量用作的参数require。Webpack需要知道在编译时捆绑哪些文件。由于它不进行程序流分析,因此无法知道传递给函数的内容。在那种情况下,这很明显,但是这可能要用用户输入来决定需要哪个模块,而且webpack不可能在编译时就知道要包含哪些模块,因此webpack不允许这样做。

您发布的html" target="_blank">示例有些不同。您可以使用require串联字符串。例如:

require(`./src/${moduleName}/test`);

webpack需要在捆绑包中包括哪些模块?该变量moduleName可以是任何值,因此在编译时不知道确切的模块。相反,它包括 所有
可能与上述表达式匹配的模块。假设以下目录结构:

src
├─ one
│   └─ test.js
├─ two
│   ├─ subdir
│   │   └─ test.js
│   └─ test.js
└─ three
    └─ test.js

所有这些test.js文件都将包含在捆绑包中,因为moduleName可能是one或类似嵌套的东西two/subdir

有关更多详细信息,请参阅带有官方文档表达的require。

您无法遍历一个数组并导入该数组的每个模块,但上述例外情况是无法通过串联字符串来进行导入,但是这样做的结果是包括了所有可能的模块,通常应避免这样做。



 类似资料:
  • 问题内容: 我正在尝试动态加载我创建的模块。 现在这可以正常工作: 但是,如果我通过动态导入尝试相同的操作,它将失败。 提供的错误是: 有什么想法吗? 编辑:使用完整范围时(它的工作原理?): 这不会引发任何错误,但是,它不会加载索引模块,而是会加载“ neoform”模块。 “ struct”的结果是: 另外,作为附带的问题,我该如何在动态加载的模块中实例化一个类?(假设所有模块都包含一个通用的

  • 问题内容: 在Java中,我可以向类路径中动态添加内容并加载类(“动态”的意思是无需重新启动应用程序)。是否有一个已知的框架/库可以处理模块的动态加载/卸载而无需重新启动? 通常的设置是负载平衡器,应用程序的多个实例以及逐步部署和重新启动新版本(尤其是对于Web应用程序)。我正在寻找其他东西- 具有多个服务/插件的应用程序,可能是单实例桌面应用程序,在其中禁用单个服务很便宜,但是关闭或重新启动完整

  • 模块是存在远程服务器上的,因此需要一个特殊的加载器来加载这些已经定义好的模块。 目前,根据模块化规范,对应的模块加载器有: CMD 直接执行:coolie.js 直接执行:Sea.js 链接: 如何实现一个 CMD 模块加载器 sea.js 与 RequireJS 的异同 AMD 直接执行:RequireJS。 链接: Javascript模块化编程(一):模块的写法 Javascript模块化编

  • 模块加载和依赖管理 综合学习: 用 Browserify 创建 JavaScript 模块 [watch][$] Webpack 基本原理 [watch] browserify-handbook [read] ES6 模块 [read] 参考/文档: browserify system.js webpack 译者补充: React Webpack cookbook 详解前端模块化工具-Webpac

  • 问题内容: 我正在使用express在Node.js中做一个项目。这是我的目录结构: 该目录包含许多与API相关的JS文件。我需要做的是建立一个挂钩系统,每当从快速HTTP服务器请求一个API函数时,它就会执行相应的API处理程序中指定的任何操作。这可能令人困惑,但希望您能理解。 Larry通过POST发送请求以获取用户详细信息。 服务器查找以查找与该请求关联的功能。 服务器执行操作并将数据发送回

  • 本文向大家介绍浅谈Webpack 是如何加载模块的,包括了浅谈Webpack 是如何加载模块的的使用技巧和注意事项,需要的朋友参考一下 Webpack 在前端开发中作为模块打包工具非常受开发者的青睐,丰富的 loader 使它可以实现各种各样的功能。本文将通过 webpack 来打包一个 js 文件,看看 webpack 是如何加载各个模块的。 两个简单的源文件 为了方便分析 webpack 加载