在奧裏利亞創建功能

Question

我嘗試biuld沒有完整的文檔的旁邊奧裏利亞插件，我讀太多的doc和插件IM構建一個簡單的插件，它包含一個簡單的日期選擇器：

首先我創建以下文件系統：

./Aurelia 
    -JbPlugin 
     -JbDirectives 
      +index.js 
      +jb-calendar.js 

和main.js文件我功能添加它象下面這樣：

aurelia.use 
 
     .standardConfiguration() 
 
     .developmentLogging() 
 
     .feature('jb-directive');

後，在插件的index.js文件我有：

import {ViewLocator , inject} from 'aurelia-framework'; 
 
import {JbCalendar} from './jb-calendar'; 
 

 
export function configure(config) { 
 
    config.globalResources([ 
 
      './jb-calendar'] 
 
    ); 
 
} 
 

 
export { 
 
    JbCalendar, 
 
};

在JB-calendar.js

：

import {inject, bindable, bindingMode, BindingEngine} from 'aurelia-framework'; 
 

 
@inject(BindingEngine) 
 
export class JbCalendar { 
 
}

在我的config.js文件：

System.config({ 
 
    baseURL: "/", 
 
    defaultJSExtensions: true, 
 
    transpiler: "babel", 
 
    babelOptions: { 
 
    "optional": [ 
 
     "runtime", 
 
     "optimisation.modules.system", 
 
     "es7.decorators", 
 
     "es7.classProperties" 
 
    ] 
 
    }, 
 
    paths: { 
 
    "github:*": "jspm_packages/github/*", 
 
    "npm:*": "jspm_packages/npm/*", 
 
    "jb-plugin:*":"Aurelia/JbPlugin/*" 
 
    }, 
 
    stage: 0, 
 

 
    map: { 
 
    "jb-directive": "jb-plugin:jb-directive", 
 
    "aurelia-animator-css": "npm:aurelia-animator-css@1.0.1", 
 
    "aurelia-bootstrapper": "npm:aurelia-bootstrapper@2.0.1", 
 
    "aurelia-fetch-client": "npm:aurelia-fetch-client@1.1.0", 
 
    "aurelia-framework": "npm:aurelia-framework@1.0.8", 
 
    "aurelia-http-client": "npm:aurelia-http-client@1.0.4", 
 
    "aurelia-pal-browser": "npm:aurelia-pal-browser@1.1.0", 
 
    "aurelia-router": "npm:aurelia-router@1.1.1", 
 
    "babel": "npm:babel-core@5.8.38", 
 
    "babel-polyfill": "npm:babel-polyfill@6.23.0", 
 
    "babel-runtime": "npm:babel-runtime@5.8.38", 
 
    "core-js": "npm:core-js@1.2.7", 
 
    "jquery": "npm:jquery@3.1.1", 
 
    "github:jspm/nodelibs-assert@0.1.0": { 
 
     "assert": "npm:assert@1.4.1" 
 
    }, 
 
    "github:jspm/nodelibs-buffer@0.1.0": { 
 
     "buffer": "npm:buffer@3.6.0" 
 
    }, 
 
    "github:jspm/nodelibs-path@0.1.0": { 
 
     "path-browserify": "npm:path-browserify@0.0.0" 
 
    }, 
 
    "github:jspm/nodelibs-process@0.1.2": { 
 
     "process": "npm:process@0.11.9" 
 
    }, 
 
    "github:jspm/nodelibs-util@0.1.0": { 
 
     "util": "npm:util@0.10.3" 
 
    }, 
 
    "github:jspm/nodelibs-vm@0.1.0": { 
 
     "vm-browserify": "npm:vm-browserify@0.0.4" 
 
    }, 
 
    "npm:assert@1.4.1": { 
 
     "assert": "github:jspm/nodelibs-assert@0.1.0", 
 
     "buffer": "github:jspm/nodelibs-buffer@0.1.0", 
 
     "process": "github:jspm/nodelibs-process@0.1.2", 
 
     "util": "npm:util@0.10.3" 
 
    }, 
 
    "npm:aurelia-animator-css@1.0.1": { 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-templating": "npm:aurelia-templating@1.2.0" 
 
    }, 
 
    "npm:aurelia-binding@1.1.1": { 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-task-queue": "npm:aurelia-task-queue@1.1.0" 
 
    }, 
 
    "npm:aurelia-bootstrapper@2.0.1": { 
 
     "aurelia-event-aggregator": "npm:aurelia-event-aggregator@1.0.1", 
 
     "aurelia-framework": "npm:aurelia-framework@1.0.8", 
 
     "aurelia-history": "npm:aurelia-history@1.0.0", 
 
     "aurelia-history-browser": "npm:aurelia-history-browser@1.0.0", 
 
     "aurelia-loader-default": "npm:aurelia-loader-default@1.0.0", 
 
     "aurelia-logging-console": "npm:aurelia-logging-console@1.0.0", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-pal-browser": "npm:aurelia-pal-browser@1.1.0", 
 
     "aurelia-polyfills": "npm:aurelia-polyfills@1.1.1", 
 
     "aurelia-router": "npm:aurelia-router@1.1.1", 
 
     "aurelia-templating": "npm:aurelia-templating@1.2.0", 
 
     "aurelia-templating-binding": "npm:aurelia-templating-binding@1.2.0", 
 
     "aurelia-templating-resources": "npm:aurelia-templating-resources@1.2.0", 
 
     "aurelia-templating-router": "npm:aurelia-templating-router@1.0.1" 
 
    }, 
 
    "npm:aurelia-dependency-injection@1.3.0": { 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-event-aggregator@1.0.1": { 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0" 
 
    }, 
 
    "npm:aurelia-framework@1.0.8": { 
 
     "aurelia-binding": "npm:aurelia-binding@1.1.1", 
 
     "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.3.0", 
 
     "aurelia-loader": "npm:aurelia-loader@1.0.0", 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1", 
 
     "aurelia-task-queue": "npm:aurelia-task-queue@1.1.0", 
 
     "aurelia-templating": "npm:aurelia-templating@1.2.0" 
 
    }, 
 
    "npm:aurelia-history-browser@1.0.0": { 
 
     "aurelia-history": "npm:aurelia-history@1.0.0", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-http-client@1.0.4": { 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1" 
 
    }, 
 
    "npm:aurelia-loader-default@1.0.0": { 
 
     "aurelia-loader": "npm:aurelia-loader@1.0.0", 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-loader@1.0.0": { 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1" 
 
    }, 
 
    "npm:aurelia-logging-console@1.0.0": { 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0" 
 
    }, 
 
    "npm:aurelia-metadata@1.0.3": { 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-pal-browser@1.1.0": { 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-polyfills@1.1.1": { 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-route-recognizer@1.1.0": { 
 
     "aurelia-path": "npm:aurelia-path@1.1.1" 
 
    }, 
 
    "npm:aurelia-router@1.1.1": { 
 
     "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.3.0", 
 
     "aurelia-event-aggregator": "npm:aurelia-event-aggregator@1.0.1", 
 
     "aurelia-history": "npm:aurelia-history@1.0.0", 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1", 
 
     "aurelia-route-recognizer": "npm:aurelia-route-recognizer@1.1.0" 
 
    }, 
 
    "npm:aurelia-task-queue@1.1.0": { 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0" 
 
    }, 
 
    "npm:aurelia-templating-binding@1.2.0": { 
 
     "aurelia-binding": "npm:aurelia-binding@1.1.1", 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-templating": "npm:aurelia-templating@1.2.0" 
 
    }, 
 
    "npm:aurelia-templating-resources@1.2.0": { 
 
     "aurelia-binding": "npm:aurelia-binding@1.1.1", 
 
     "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.3.0", 
 
     "aurelia-loader": "npm:aurelia-loader@1.0.0", 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1", 
 
     "aurelia-task-queue": "npm:aurelia-task-queue@1.1.0", 
 
     "aurelia-templating": "npm:aurelia-templating@1.2.0" 
 
    }, 
 
    "npm:aurelia-templating-router@1.0.1": { 
 
     "aurelia-binding": "npm:aurelia-binding@1.1.1", 
 
     "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.3.0", 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1", 
 
     "aurelia-router": "npm:aurelia-router@1.1.1", 
 
     "aurelia-templating": "npm:aurelia-templating@1.2.0" 
 
    }, 
 
    "npm:aurelia-templating@1.2.0": { 
 
     "aurelia-binding": "npm:aurelia-binding@1.1.1", 
 
     "aurelia-dependency-injection": "npm:aurelia-dependency-injection@1.3.0", 
 
     "aurelia-loader": "npm:aurelia-loader@1.0.0", 
 
     "aurelia-logging": "npm:aurelia-logging@1.2.0", 
 
     "aurelia-metadata": "npm:aurelia-metadata@1.0.3", 
 
     "aurelia-pal": "npm:aurelia-pal@1.2.0", 
 
     "aurelia-path": "npm:aurelia-path@1.1.1", 
 
     "aurelia-task-queue": "npm:aurelia-task-queue@1.1.0" 
 
    }, 
 
    "npm:babel-polyfill@6.23.0": { 
 
     "babel-runtime": "npm:babel-runtime@6.23.0", 
 
     "core-js": "npm:core-js@2.4.1", 
 
     "fs": "github:jspm/nodelibs-fs@0.1.2", 
 
     "path": "github:jspm/nodelibs-path@0.1.0", 
 
     "process": "github:jspm/nodelibs-process@0.1.2", 
 
     "regenerator-runtime": "npm:regenerator-runtime@0.10.3" 
 
    }, 
 
    "npm:babel-runtime@5.8.38": { 
 
     "process": "github:jspm/nodelibs-process@0.1.2" 
 
    }, 
 
    "npm:babel-runtime@6.23.0": { 
 
     "core-js": "npm:core-js@2.4.1", 
 
     "regenerator-runtime": "npm:regenerator-runtime@0.10.3" 
 
    }, 
 
    "npm:buffer@3.6.0": { 
 
     "base64-js": "npm:base64-js@0.0.8", 
 
     "child_process": "github:jspm/nodelibs-child_process@0.1.0", 
 
     "fs": "github:jspm/nodelibs-fs@0.1.2", 
 
     "ieee754": "npm:ieee754@1.1.8", 
 
     "isarray": "npm:isarray@1.0.0", 
 
     "process": "github:jspm/nodelibs-process@0.1.2" 
 
    }, 
 
    "npm:core-js@1.2.7": { 
 
     "fs": "github:jspm/nodelibs-fs@0.1.2", 
 
     "path": "github:jspm/nodelibs-path@0.1.0", 
 
     "process": "github:jspm/nodelibs-process@0.1.2", 
 
     "systemjs-json": "github:systemjs/plugin-json@0.1.2" 
 
    }, 
 
    "npm:core-js@2.4.1": { 
 
     "fs": "github:jspm/nodelibs-fs@0.1.2", 
 
     "path": "github:jspm/nodelibs-path@0.1.0", 
 
     "process": "github:jspm/nodelibs-process@0.1.2", 
 
     "systemjs-json": "github:systemjs/plugin-json@0.1.2" 
 
    }, 
 
    "npm:inherits@2.0.1": { 
 
     "util": "github:jspm/nodelibs-util@0.1.0" 
 
    }, 
 
    "npm:path-browserify@0.0.0": { 
 
     "process": "github:jspm/nodelibs-process@0.1.2" 
 
    }, 
 
    "npm:process@0.11.9": { 
 
     "assert": "github:jspm/nodelibs-assert@0.1.0", 
 
     "fs": "github:jspm/nodelibs-fs@0.1.2", 
 
     "vm": "github:jspm/nodelibs-vm@0.1.0" 
 
    }, 
 
    "npm:regenerator-runtime@0.10.3": { 
 
     "path": "github:jspm/nodelibs-path@0.1.0", 
 
     "process": "github:jspm/nodelibs-process@0.1.2" 
 
    }, 
 
    "npm:util@0.10.3": { 
 
     "inherits": "npm:inherits@2.0.1", 
 
     "process": "github:jspm/nodelibs-process@0.1.2" 
 
    }, 
 
    "npm:vm-browserify@0.0.4": { 
 
     "indexof": "npm:indexof@0.0.1" 
 
    } 
 
    } 
 
});

中的package.json文件

我有：

{ 
 
    "jspm": { 
 
    "main": "index", 
 
    "format": "amd", 
 
    "dependencies": { 
 
     "aurelia-animator-css": "npm:aurelia-animator-css@^1.0.1", 
 
     "aurelia-bootstrapper": "npm:aurelia-bootstrapper@^2.0.1", 
 
     "aurelia-fetch-client": "npm:aurelia-fetch-client@^1.1.0", 
 
     "aurelia-framework": "npm:aurelia-framework@^1.0.8", 
 
     "aurelia-http-client": "npm:aurelia-http-client@^1.0.4", 
 
     "aurelia-pal-browser": "npm:aurelia-pal-browser@^1.1.0", 
 
     "aurelia-router": "npm:aurelia-router@^1.1.1", 
 
     "babel-polyfill": "npm:babel-polyfill@^6.23.0", 
 
     "jquery": "npm:jquery@^3.1.1", 
 
     "jb-directive": "jb-plugin:jb-directive" 
 
    }, 
 
    "devDependencies": { 
 
     "babel": "npm:babel-core@^5.8.24", 
 
     "babel-runtime": "npm:babel-runtime@^5.8.24", 
 
     "core-js": "npm:core-js@^1.1.4" 
 
    } 
 
    } 
 
}

所以它沒有任何錯誤很好地工作，並加載所有的JS，但是當我想使用像儀表板js這樣的真實課程插件如下：

import {JbCalendar} from 'jb-directive'; 

它拋出一個錯誤對我說：

GET http://localhost:9001/Aurelia/JbPlugin/jb-directive.js 404 (Not Found) 

爲什麼奧裏利亞航線插件像頂部犯規它soppose加載index.js文件？

編輯： 我findout我的插件是做工精細什麼，我需要的只是用指令沒有任何同類「進口」監守我在全球資源加我的指令，它可以反正在應用程序中使用，而不進口

Answer 1

試試這個

aurelia.use 
    .standardConfiguration() 
    .developmentLogging() 
    .plugin('JbPlguins/JbDirectives');