Satıcı js dosyalarını (wrap bootstrap'ten) Rails 4'e ekleme

Question

Satıcı js varlıklarını Rails 4 uygulamasına nasıl dahil edeceğimi anlamaya çalışıyorum.

Uygulamam bootstrap kullanıyor. Satıcı dosyaları npm.js. adlı bir js dosyası içerir. İçinde aşağıdaki Bu dosya vardır: my app/varlık/javascript klasöründe

// This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment. 
require('../../js/transition.js') 
require('../../js/alert.js') 
require('../../js/button.js') 
require('../../js/carousel.js') 
require('../../js/collapse.js') 
require('../../js/dropdown.js') 
require('../../js/modal.js') 
require('../../js/tooltip.js') 
require('../../js/popover.js') 
require('../../js/scrollspy.js') 
require('../../js/tab.js') 
require('../../js/affix.js') 

, ben application.js adlı bir dosya var. Bu dosyada, ben vardır:

Benim konsol denetçisinde

//= require npm 

, ben npm dosyasının birleştirilmesi ile bir hata görebilirsiniz. Hata iletisi:

npm.self-f66d504….js?body=1:2 Uncaught ReferenceError: require is not defined 

Ben npm.js dosyasında belirtilmiştir ../ .. referanslarla ilgili bir şey olabileceğini düşünüyorum.

Bunu raylar 4 (heroku'da barındırılan) olarak kullanmak için nasıl uyarlayacağını bilen var mı?

Çok teşekkürler.

Answer 1

JS'nizde bulunan require(...) ifadeleri, CommonJS biçimindedir (bu nedenle üstte) ve Node.js'de yaygın olarak kullanılmaktadır, ancak tarayıcı ortamlarında desteklenmemektedir, bu nedenle denetçide bu hatayı alıyorsunuzdur .

Seçeneklerden biri dosyası (ben farklı isim öneririm rağmen) tek npm.js içine bağlamak ve bu JS dosyaları her derlemek için Grunt ile Browserify kullanmaktır. JS dosyalarınızı yönetmek için zaten browserify_rails, Grunt veya benzer bir araç kullanıyor musunuz?

Yani application.js olacaktı: Eğer Grunt/Browserify ile işe yaramadıysa yukarıdaki deyimi belirsiz olup olmadığını

veya, sadece Raylar varlık boru hattının sadık muhtemelen en iyi ve en basit olduğunu

//= require('<path>/js/transition.js') 
//= require('<path>/js/alert.js') 
//= require('<path>/js/button.js') 
//= require('<path>/js/carousel.js') 
// etc... 

yerine:

//= require npm 

Ve bu yukarıdaki örnekteki eşdeğer JS üretmelidir.

Son olarak, <path> sizin config.assets.paths yapılandırma değişken olarak dahil olduğundan emin olun.