大きなjavascriptファイルを複数の小さなファイルに分割する

jQueryとjQuery UIを使用してDOM要素を操作しています。大きなjavascriptファイルを複数の小さなファイルに分割する

index.htmlを：

<html> 
<head> 
<link href="dashboard.css" rel="stylesheet"> 
</head> 
<body> 
<script src="dashboard.js"></script> 
<body> 
</html>

dashboard.js：

function addAccordian() { 
    // some logic here 
} 

function addConnectedSortable() { 
    // more logic here 
} 

function addPiecharts() { 
    // a huge chunk of logic here 

    // for example, 

    // several ... 
    // hundred ... 
    // line ... 
    // of code 

} 

function readyFn(jQuery) { 
    addAccordian(); 
    addConnectedSortable(); 
    addPiecharts(); 
} 

$(document).ready(readyFn);

私だけdashboard.jsファイルは、時間とともにどんどん大きく成長描くことができます。

質問：いくつかの小さなJavaScriptファイルに分割する方法はありますし、何とかinclude/importそれら？

私はJavaの背景から来ているので、質問があまり意味がない場合は私を許してください。

私はこのプロジェクトはまだ早いので、私たちが使用する技術には柔軟性があるので、何か提案はありません。

出典

2017-04-13 Jeff Xiao

うん。それはしばしばビルドプロセスと呼ばれます。例えばwebpack/gulp/gruntのようなものを使って行うことができます。 –

私は[この記事]（http://ryanmorr.com/understanding-scope-and-context-in-javascript/）がいくつかの名前の競合の問題を解決することを発見しました。 "module pattern"を検索 –

必要なファイルを作成し、ページに含めるだけです。ブラウザで同時に読み込むことができるように、head要素に含めることをお勧めします。

<script src="file1.js" type="text/javascript"></script> 
 
<script src="file2.js" type="text/javascript"></script> 
 
<script src="file3.js" type="text/javascript"></script>

出典

2017-04-13 18:02:31 gforce301

私はこの答えを受け入れるでしょう。名前の競合の解決策に関する質問の私のコメントを見てください –

大きなjavascriptファイルを複数の小さなファイルに分割する

答えて

関連する問題