如何將日期選擇器或任何常規jQuery插件添加到Ember-CLI App

Question

所以我想嘗試將pikaday日期選擇器添加到Ember-CLI應用程序。

我的/app/views/calendar-view.js有以下內容

import Ember from 'ember';

export default Ember.TextView.extend({
    modelChangedValue: function(){
        console.log(this.get('value'));
    }.observes("value"),

    didInsertElement: function(){
        currentYear = (new Date()).getFullYear();
        formElement = this.$()[0];
        picker = new Pikaday({
            field: formElement,
            yearRange: [1900,currentYear+2]
        });
        this.set("_picker", picker);
  },

    willDestroyElement: function(){

        picker = this.get("_picker");

        if (picker) {
            picker.destroy();
        }

        this.set("_picker", null);
  }

});

我的主要問題是如何將插件本身添加到ember-cli中？

這是pikaday的github鏈接： https ： //github.com/dbushell/Pikaday

更具體地說，我認為這部分可能很重要，因為Ember-CLI使用AMD： https ： //github.com/dbushell/Pikaday#amd-support

那么如何將插件本身添加到ember-cli？

Answer 1

更新

自寫這個答案以來，Ember Addon API已經變得更加實用，如果你正在構建一個添加到常規js插件的Ember組件/ mixin /其他類，那么它是一個完美的選擇。

定期安裝

在“常規安裝”情況下，您希望通過您的應用程序提供該插件，並將其包含在應用程序的有效負載中，無論如何。 為此，請將文件/包添加到項目的vendor目錄中。 有兩種立即可用的方法：使用Bower或只是在目錄中保存文件或包。

1）涼亭

使用Bower通過終端安裝包，如：

bower install ember-validations

或者，如果您的bower.json文件中沒有可用的簡易安裝Bower軟件包：

{
  "name": "app",
  "dependencies": {
    "chosen": "https://github.com/harvesthq/chosen/releases/download/v1.1.0/chosen_v1.1.0.zip"
  }
}

2）寫一個文件

您不必使用Bower將文件和目錄添加到vendor目錄。 您可以在vendor目錄中的任何位置創建文件，將插件javascript復制並粘貼到其中並保存，它仍然可以導入到您的應用程序中。

3）在您的應用程序中提供它

無論您創建和保存插件腳本的方法如何，您都必須將文件直接導入到您的應用程序中。 您可以在Brocfile.js執行此Brocfile.js 。 在module.exports = app.toTree();之前添加帶有文件路徑的導入（主文件，如果它是bower安裝的包） 。

app.import('vendor/ember-validations/index.js');
app.import('vendor/chosen/chosen.jquery.min.js');

在ember-cli文檔的Managing Dependencies部分中有更多信息。

Polyfill或其他非必要的插件

在某些情況下，您不希望始終在應用中加載/運行腳本。 例如，僅在用戶使用IE時才加載大型polyfill 。 在這種情況下，您可以在public/assets創建一個目錄來保存javascript文件，並使用jQuery的$.getScript()方法在初始化程序或Ember應用程序中的其他位置加載它們。

我在這里回答了關於這種情況的類似問題。