將所有javascript文件導入到一個javascript文件中

Question

因爲我們在SASS中使用@import來導入和編譯成單個CSS文件的SASS文件。

與此類似，有沒有什麼辦法可以用於JavaScript？

Answer 1

據我所知require和import將無法​​正常工作，因爲它僅用於模塊（node_modules文件夾）。

連接所有.js該文件將是一個好主意。您可以使用gulp-concat包。

下面是它如何工作：

var concat = require('gulp-concat'); 

gulp.task('scripts', function() { 
    return gulp.src('./lib/*.js') 
    .pipe(concat('all.js')) 
    .pipe(gulp.dest('./dist/')); 
}); 

---

從除了：不要忘了閱讀。

高德納在1974年的名言：

程序員浪費大量的時間思考，或 擔心，他們的節目非關鍵部件的速度， 這些嘗試的效率實際上有很強的在考慮調試和維護時對負面影響 。我們應該忘記 小效率說約97％的時間：不成熟的優化 是所有邪惡的根源。然而，我們不應該在關鍵的3％中放棄我們的機會 。

我認爲最小化HTTP請求是Web性能的一個非常重要的領域，所以不要誤會我的意思。我引用Knuth是因爲他的陳述對於任何想要優化系統的人都是非常有價值的。確保你的優化是有意義的。

衡量優化影響的最佳方法是運行測試。嘗試設置A/B測試;分別加載6個文件並加載一個連接文件。在多個瀏覽器中，在空/準備好的緩存環境中多次運行此測試。研究您的用戶在您的網站上的體驗。空閒緩存與預備緩存有多少次訪問？

這些發現會告訴你你的優化是否有意義。頁面實際加載速度有多快？如果它是邊緣的，也許有一個更需要關注的關鍵領域（3％）。

Answer 2

不一樣。這兩種一般方法是：

1. 使用require或import並使用模塊寫入所有內容。然後你可以使用Babel和Webpack等工具。
2. 簡單地連接文件，可能使用描述放置順序的數據文件。 （對於一個項目，我編寫了一個包裝腳本，它從JSON文件中讀取訂單，然後用該列表調用Uglify作爲參數）。