的WebPack使用節點「FS」構建時期間模塊，使瀏覽器獲得的功能結果

問題：有沒有辦法告訴的WebPack告訴內置模塊模塊，如FS構建過程中執行，因此瀏覽器得到這個函數的結果，而不是函數調用本身？的WebPack使用節點「FS」構建時期間模塊，使瀏覽器獲得的功能結果

我的情況：

目前我正在開發使用的WebPack瀏覽器的應用程序。我試圖在我的一個文件中使用節點'fs'模塊來要求來自其他目錄的index.js文件。例如：

plugins 
├──plugin1 
│   ├── index.js (simply exports an object) 
│ 
├──plugin2 
│  ├── index.js (simply exports an object) 
| 
├──plugin3 
│  ├── index.js (simply exports an object) 
| 
|──index.js (want to require all index.js from each plugin directory here)

我越來越用的WebPack說法錯誤：位於`插件/ index.js'，這只是想要求我的其他文件Can't resolve 'fs' in somepath/node_modules/require-dir

我的文件index.js。

//module from NPM which uses the 'fs' module ('im not explicity using it) 
    const requireDir = require('require-dir'); 
    const allPlugins = requireDir('./plugins/'); 
    console.log(allPlugins);

無法解析 'FS' 在 '/ SOME_PATH/node_modules /要求-DIR'

來源

2017-07-26 Clifford Fajardo

您可以發佈源，你要導入'fs'？ –

你這裏有兩種選擇。

我沒有親自使用這個，但是按照規定here可以使用node配置價值。

node: { fs: {true, "mock", "empty", false} }

設置fs上述任何的值。

請勿使用fs模塊。它是一個內置/本地模塊，可能或不可能依賴本機V8/C++函數/庫。請記住，webpack通常會捆綁瀏覽器的資產。因此，而不是依靠插件，您可以手動導入插件如：

plugins/index.js

const plugin1 = require('./plugin1') 
const plugin2 = require('./plugin2') 

module.exports = { 
    plugin1, 
    plugin2 
}

你也可以使用this答案填充工具的require-dir模塊。

來源

2017-07-26 05:40:54

感謝您刪除鏈接到polyfill'require-dir'我在那裏找到了我的解決方案=）。每個文件的要求也起作用，完全忘記了這一點。 –

感謝Francisco Mateo's有關polyfilling的其他鏈接require-dir，我瞭解到context method webpack添加到require。

這讓我做動態的，需要像這樣在我的插件/ index.js文件：

//require all index.js files inside of /plugins directory   
    let context = require.context('.', true, /\index\.js/); 
    const loadPlugins = function(ctx){ 
    let keys = context.keys(); 
    let values = keys.map(context); 
    return values; 
    } 
    //array of values from each index.js require 
    console.log('loadPlugins', loadPlugins());

來源

2017-07-26 06:38:37

的WebPack使用節點「FS」構建時期間模塊，使瀏覽器獲得的功能結果

回答

相關問題