モジュールとしてエクスポートされたすべてのファイルを特定のフォルダーに入れて、インポートして単一のオブジェクトとして使用できるようにしようとしています。これはどのようにすればよいですか?
私は長い長い単一ファイルでjavascriptプラグインを作成しました。そして私は今それをいくつかのファイルで区切るようにしようとしています。私はそれにWebpackを使用しています。
そして、私のプラグインコードには、それぞれ200〜300行の40〜50個の関数を含む「fn」という名前の巨大なオブジェクトがありました。それらを分割するために、「fn」という名前のフォルダーを作成し、各関数を各ファイルとして配置しました。ファイル名と関数名はそれぞれ同じです。そのため、「foo」という名前の関数は、デフォルトで「fn」フォルダー内の「foo.js」という名前のファイルにエクスポートされます。
そして今、私はそれらすべてをインポートして、このような単一のオブジェクトとしてエクスポートしようとしています。
src / fn / foo_or_whatever.js
export default function aFunctionWhichIUse(){
// return whatever;
}
src / fn / index.js
import foo from './foo';
import bar from './bar';
import fooz from './fooz';
import baz from './baz';
import kee from './kee';
import poo from './poo';
import tar from './tar';
import doo from './doo';
.
.
.
import foo_or_whatever from './foo_or_whatever';
export default {
foo,
bar,
fooz,
baz,
kee,
poo,
tar,
doo,
.
.
.
foo_or_whatever,
}
src / index.js
import fn from './fn'
しかし、私はそれが意味をなさないと思います。ここで、「fn」オブジェクトに関数を追加するために、同じ単語を4回ごとに入力する必要があります。
フォルダからのすべてのファイルのインポートは、インポート/エクスポートシステムではサポートされていないことがわかりました。次に、何を使用する必要があり、それを行うためのコードをどのように作成する必要がありますか?
このようにする方法はありますか?方法がwebpackで機能する限り、方法がインポート/エクスポートシステムであるかどうかは関係ありません。
src / index.js
import * as fn from './fn';
const fs = require('fs');
const path = require('path');
const basename = path.basename(__filename);
const functions = {}
fs
.readdirSync("./")
.filter(file => (file.indexOf('.') !== 0) && (file !== basename) && (file.slice(-3) === '.js'))
.map((file) => {functions[file.slice(0, -3)] = require(path.join(__dirname, file})))
module.exports = functions;
このようなものは役に立ちますか?
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加