如何使用aurelia的微風？

Question

我是aurelia的新手，我使用skeleton-typescript-aspnetcore框架項目來構建我的第一個應用程序。骨架工作正常，但是當我跟着Aurelia路上，微風插件指南將它集成到我的應用程序，我在TS文件中使用

import breeze from 'breeze'; 

，但有一個錯誤：無法找到模塊「微風」。我搜索了很多，以至於有人提到d.ts文件丟失了，我將它從git（https://github.com/jdanyow/aurelia-breeze/blob/master/dist/aurelia-breeze.d.ts）複製到typings文件夾，但d.ts文件在第一行中出現了其他錯誤，無法找到模塊'breeze-client 「：

import breeze from 'breeze-client'; 

我檢查NMP文件夾（wwwroot的/ NMP），二者奧裏利亞-微風和微風的客戶端都在那裏，也，在的package.json相同。

我比較了aurelia-breeze.d.ts與其他d.ts文件在類型文件夾下的文件， 這些文件的骨架都是以index.d.ts命名的，並且帶有typings.json用於decalaration。

所以我想這個錯誤應該是由類型配置造成的，我長期搜索Google，但沒有答案，你能告訴我如何使它工作嗎？提前致謝。

Answer 1

我不在我的Aurelia應用程序中使用TypeScript，但是我遇到了集成微風的相同問題。最後，我通過將它添加爲一個簡單的腳本而不是從node_modules（或者jspm_packages，取決於您使用哪一個）加載它來解決它（或者更確切地說找到了這個解決方法）。

這是我的新main.js文件：

export function configure(aurelia) {  
    aurelia.use 
     .standardConfiguration()   
     .plugin('aurelia-knockout'); 

    return aurelia.start().then(() => { 
     require(["../scripts/lib/breeze.debug"], function(breeze) { 
      require([ 
       "../scripts/lib/breeze.savequeuing", 
      ], function(savequeuing){ 
       aurelia.setRoot(); 
      });    
     });      
    });  
} 

希望這有助於。在我的情況下，我甚至在微風本身加載之後整合了breeze.savequeuing的微風插件。有可能有更好的方法來做到這一點。

另請注意我使用「require」作爲模塊加載程序。我用的是奧裏利亞CLI所以我在aurelia.json文件中設置爲「打造」下這樣的：

"loader": { 
     "type": "require", 
     "configTarget": "vendor-bundle.js", 
     "includeBundleMetadataInConfig": "auto", 
     "config": { 
     "waitSeconds": 0, 
     "paths": { 
      "jquery": "../scripts/lib/cdn/jquery-3.1.0.min", 
      "knockout": "../scripts/lib/knockout-3.4.0"   
     } 
     }, 
.... 
} 

，並在「包」是這樣的：

 { 
     "name": "vendor-bundle.js", 
     "prepend": [ 
      "node_modules/bluebird/js/browser/bluebird.core.js",   
      "scripts/lib/require.js" 
     ], 
... 
} 

Answer 2

要使用breezejs客戶端aurelia你必須做如下

1. 安裝所需的軟件包。

npm install breeze-client --save 
npm install aurelia-breeze --save 

上的模塊加載器

配置的依賴關係。

就我而言，我使用了AMD requirejs這樣的依賴將是如下...

paths... 

"aurelia-breeze":'../node_modules/aurelia-breeze/dist/amd/aurelia-breeze' 
"breeze-client": '../node_modules/breeze-client/breeze.base.min' 
"breeze.modelLibrary": '../node_modules/breeze-client/breeze.modelLibrary.backingStore' 
"breeze.dataService": '../node_modules/breeze-client/breeze.dataService.webApi' 
"breeze.uriBuilder": '../node_modules/breeze-client/breeze.uriBuilder.json' 


shims... 

'aurelia-breeze': { 
     exports: 'BreezeObjectObserver', 
     deps: ['breeze-client', 'breeze.modelLibrary', 'breeze.dataService', 'breeze.uriBuilder'] 
     } 

'breeze-client': { 
     exports: 'breeze' 
     } 

（requirejs config.js文件和Aurelia路上。JSON文件完全包括下面）

導入和初始化庫上的打字稿的項目，因爲你需要

import * as breeze from 'breeze-client' 

    breeze.NamingConvention.camelCase.setAsDefault(); 
    breeze.config.initializeAdapterInstance('modelLibrary', 
'backingStore', true); 

它完成了！你現在可以使用微風。即

const entityManager = new 
EntityManager'http://zzaapi.azurewebsites.net/breeze/zza') const 
entityQuery = EntityQuery.from(‘Customers’); 

entityManager.executeQuery(entityQuery).then(queryResult => 
console.log(queryResult.results)); 

（從https://www.pluralsight.com/courses/building-data-centric-apps-angular-breezejs布賴恩·諾伊斯精品課程）

PS：我會發布我requirejs config.js文件的全部內容，也爲奧裏利亞CLI構建的aurelia.json，取看看並注意prepends，preload和墊片。

//-------------------config.js---------------------------------------------- 
    require.config(
     { 
     baseUrl: 'src', 
     paths: { 

      pipelines: 'resources/pipelines', 
      templates: 'resources/templates', 
      interceptors: 'resources/interceptors', 

      bluebird: '../node_modules/bluebird/js/browser/bluebird.min', 
      bootstrap: '../node_modules/bootstrap/dist/js/bootstrap.min', 

      "aurelia-animator-css": '../node_modules/aurelia-animator-css/dist/amd/aurelia-animator-css', 
      "aurelia-binding": '../node_modules/aurelia-binding/dist/amd/aurelia-binding', 
      "aurelia-bootstrapper": '../node_modules/aurelia-bootstrapper/dist/amd/aurelia-bootstrapper', 
      "aurelia-breeze": '../node_modules/aurelia-breeze/dist/amd/aurelia-breeze', 
      "aurelia-computed": '../node_modules/aurelia-computed/dist/amd/aurelia-computed', 
      "aurelia-dependency-injection": '../node_modules/aurelia-dependency-injection/dist/amd/aurelia-dependency-injection', 
      "aurelia-event-aggregator": '../node_modules/aurelia-event-aggregator/dist/amd/aurelia-event-aggregator', 
      "aurelia-fetch-client": '../node_modules/aurelia-fetch-client/dist/amd/aurelia-fetch-client', 
      "aurelia-framework": '../node_modules/aurelia-framework/dist/amd/aurelia-framework', 
      "aurelia-history": '../node_modules/aurelia-history/dist/amd/aurelia-history', 
      "aurelia-history-browser": '../node_modules/aurelia-history-browser/dist/amd/aurelia-history-browser', 
      "aurelia-http-client": '../node_modules/aurelia-http-client/dist/amd/aurelia-http-client', 
      "aurelia-loader": '../node_modules/aurelia-loader/dist/amd/aurelia-loader', 
      "aurelia-loader-default": '../node_modules/aurelia-loader-default/dist/amd/aurelia-loader-default', 
      "aurelia-logging": '../node_modules/aurelia-logging/dist/amd/aurelia-logging', 
      "aurelia-logging-console": '../node_modules/aurelia-logging-console/dist/amd/aurelia-logging-console', 
      "aurelia-metadata": '../node_modules/aurelia-metadata/dist/amd/aurelia-metadata', 
      "aurelia-pal": '../node_modules/aurelia-pal/dist/amd/aurelia-pal', 
      "aurelia-pal-browser": '../node_modules/aurelia-pal-browser/dist/amd/aurelia-pal-browser', 
      "aurelia-path": '../node_modules/aurelia-path/dist/amd/aurelia-path', 
      "aurelia-polyfills": '../node_modules/aurelia-polyfills/dist/amd/aurelia-polyfills', 
      "aurelia-router": '../node_modules/aurelia-router/dist/amd/aurelia-router', 
      "aurelia-route-recognizer": '../node_modules/aurelia-route-recognizer/dist/amd/aurelia-route-recognizer', 
      "aurelia-task-queue": '../node_modules/aurelia-task-queue/dist/amd/aurelia-task-queue', 
      "aurelia-templating": '../node_modules/aurelia-templating/dist/amd/aurelia-templating', 
      "aurelia-templating-binding": '../node_modules/aurelia-templating-binding/dist/amd/aurelia-templating-binding', 

      "breeze-client": '../node_modules/breeze-client/breeze.base.min', 
      "breeze.modelLibrary": '../node_modules/breeze-client/breeze.modelLibrary.backingStore', 
      "breeze.dataService": '../node_modules/breeze-client/breeze.dataService.webApi', 
      "breeze.uriBuilder": '../node_modules/breeze-client/breeze.uriBuilder.json', 

      jquery: '../node_modules/jquery/dist/jquery.min', 
      lodash: '../node_modules/lodash/lodash.min', 
      moment: '../node_modules/moment/min/moment-with-locales.min', 
      numeral: '../node_modules/numeral/min/numeral.min', 
      pouchdb: '../node_modules/pouchdb/dist/pouchdb.min', 
      text: '../node_modules/text/text', 
      toastr: '../node_modules/toastr/build/toastr.min', 

      "jquery-ui": '../node_modules/jquery-ui/dist/jquery-ui.min' 

     }, 
     packages: [ 
      { 
      name: 'aurelia-dialog', 
      location: '../node_modules/aurelia-dialog/dist/amd', 
      main: 'aurelia-dialog' 
      }, 
      { 
      name: 'aurelia-templating-resources', 
      location: '../node_modules/aurelia-templating-resources/dist/amd', 
      main: 'aurelia-templating-resources' 
      }, 
      { 
      name: 'aurelia-templating-router', 
      location: '../node_modules/aurelia-templating-router/dist/amd', 
      main: 'aurelia-templating-router' 
      }, 
      { 
      name: 'aurelia-testing', 
      location: '../node_modules/aurelia-testing/dist/amd', 
      main: 'aurelia-testing' 
      }, 
      { 
      name: 'aurelia-validation', 
      location: '../node_modules/aurelia-validation/dist/amd', 
      main: 'aurelia-validation' 
      }, 
      { 
      name: 'popper.js', 
      location: '../node_modules/popper.js/dist/umd/', 
      main: 'popper.min' 
      } 
     ], 
     shim: { 
      'aurelia-breeze': { 
      exports: 'BreezeObjectObserver', 
      deps: ['breeze-client', 'breeze.modelLibrary', 'breeze.dataService', 'breeze.uriBuilder'] 
      }, 
      'breeze-client': { 
      exports: 'breeze' 
      }, 
      bootstrap: { 
      exports: '$.fn.button', 
      deps: ['jquery', 'popper.js'] 
      }, 
      jquery: { 
      exports: '$' 
      }, 
      "jquery-ui": { 
      exports: '$.autocomplete', 
      deps: ['jquery'] 
      }, 
      lodash: { 
      exports: '_' 
      }, 
      "popper.js": { 
      exports: 'Popper' 
      }, 
      toastr: { 
      deps: ['jquery'] 
      } 

     } 
     }); 

    require(['aurelia-bootstrapper']); 

//-------------------aurelia.json---------------------------------------------- 
    { 
     "name": "mgame", 
     "type": "project:application", 
     "bundler": { 
     "id": "cli", 
     "displayName": "Aurelia-CLI" 
     }, 
     "platform": { 
     "id": "aspnetcore", 
     "displayName": "ASP.NET Core", 
     "index": "index.html", 
     "baseDir": ".", 
     "output": "dist" 
     }, 
     "transpiler": { 
     "id": "typescript", 
     "displayName": "TypeScript", 
     "fileExtension": ".ts", 
     "dtsSource": [ "./custom_typings/**/*.d.ts" ], 
     "source": "src/**/*.ts" 
     }, 
     "markupProcessor": { 
     "id": "maximum", 
     "displayName": "Maximum Minification", 
     "fileExtension": ".html", 
     "source": "src/**/*.html" 
     }, 
     "cssProcessor": { 
     "id": "sass", 
     "displayName": "Sass", 
     "fileExtension": ".scss", 
     "source": "src/**/*.scss" 
     }, 
     "editor": { 
     "id": "visualstudio", 
     "displayName": "Visual Studio" 
     }, 
     "testFramework": { 
     "id": "jasmine", 
     "displayName": "Jasmine" 
     }, 
     "unitTestRunner": { 
     "id": "karma", 
     "displayName": "Karma", 
     "source": "test/unit/**/*.ts" 
     }, 
     "e2eTestRunner": { 
     "id": "protractor", 
     "displayName": "Protractor", 
     "source": "test/e2e/src/**/*.ts", 
     "dist": "test/e2e/dist/", 
     "typingsSource": [ "node_modules//@types/**/*.d.ts", "custom_typings/**/*.d.ts" ] 
     }, 
     "paths": { 
     "root": "src", 
     "resources": "resources", 
     "elements": "resources/elements", 
     "pipelines": "resources/pipelines", 
     "templates": "resources/templates", 
     "attributes": "resources/attributes", 
     "interceptors": "resources/interceptors", 
     "valueConverters": "resources/converters", 
     "bindingBehaviors": "resources/behaviors", 
     "assets": [ 
      { 
      "src": "node_modules/jquery-ui/dist/images/*", 
      "dest": "/../images" 
      }, 
      { 
      "src": "node_modules/font-awesome/css/font-awesome.min.css", 
      "dest": "/css" 
      }, 
      { 
      "src": "node_modules/font-awesome/fonts/*", 
      "dest": "/fonts" 
      } 
     ] 
     }, 
     "build": { 
     "targets": [ 
      { 
      "id": "aspnetcore", 
      "displayName": "ASP.NET Core", 
      "index": "index.html", 
      "baseDir": ".", 
      "output": "dist" 
      } 
     ], 
     "loader": { 
      "type": "require", 
      "configTarget": "vendor-bundle.js", 
      "includeBundleMetadataInConfig": "auto", 
      "plugins": [ 
      { 
       "name": "text", 
       "extensions": [ 
       ".html", 
       ".css" 
       ], 
       "stub": true 
      } 
      ] 
     }, 
     "options": { 
      "minify": "stage & prod", 
      "sourcemaps": "dev & stage" 
     }, 
     "bundles": [ 
      { 
      "name": "app-bundle.js", 
      "source": [ 
       "[**/*.js]", 
       "**/*.{css,html}" 
      ] 
      }, 
      { 
      "name": "vendor-bundle.js", 
      "prepend": [ 
       "node_modules/bluebird/js/browser/bluebird.min.js", 
       "node_modules/popper.js/dist/umd/popper.min.js", 
       "node_modules/requirejs/require.js" 
      ], 
      "dependencies": [ 
       "jquery", 
       "lodash", 
       "moment", 
       "numeral", 
       "text", 
       { 
       "name": "aurelia-animator-css", 
       "path": "../node_modules/aurelia-animator-css/dist/amd", 
       "main": "aurelia-animator-css" 
       }, 
       { 
       "name": "aurelia-binding", 
       "path": "../node_modules/aurelia-binding/dist/amd", 
       "main": "aurelia-binding" 
       }, 
       { 
       "name": "aurelia-bootstrapper", 
       "path": "../node_modules/aurelia-bootstrapper/dist/amd", 
       "main": "aurelia-bootstrapper" 
       }, 
       { 
       "name": "aurelia-breeze", 
       "path": "../node_modules/aurelia-breeze/dist/amd", 
       "main": "aurelia-breeze", 
       "exports": "BreezeObjectObserver", 
       "deps": [ "breeze-client", "breeze.modelLibrary", "breeze.dataService", "breeze.uriBuilder" ] 
       }, 
       { 
       "name": "aurelia-computed", 
       "path": "../node_modules/aurelia-computed/dist/amd", 
       "main": "aurelia-computed" 
       }, 
       { 
       "name": "aurelia-dependency-injection", 
       "path": "../node_modules/aurelia-dependency-injection/dist/amd", 
       "main": "aurelia-dependency-injection" 
       }, 
       { 
       "name": "aurelia-dialog", 
       "path": "../node_modules/aurelia-dialog/dist/amd", 
       "main": "aurelia-dialog" 
       }, 
       { 
       "name": "aurelia-event-aggregator", 
       "path": "../node_modules/aurelia-event-aggregator/dist/amd", 
       "main": "aurelia-event-aggregator" 
       }, 
       { 
       "name": "aurelia-fetch-client", 
       "path": "../node_modules/aurelia-fetch-client/dist/amd", 
       "main": "aurelia-fetch-client" 
       }, 
       { 
       "name": "aurelia-framework", 
       "path": "../node_modules/aurelia-framework/dist/amd", 
       "main": "aurelia-framework" 
       }, 
       { 
       "name": "aurelia-history", 
       "path": "../node_modules/aurelia-history/dist/amd", 
       "main": "aurelia-history" 
       }, 
       { 
       "name": "aurelia-history-browser", 
       "path": "../node_modules/aurelia-history-browser/dist/amd", 
       "main": "aurelia-history-browser" 
       }, 
       { 
       "name": "aurelia-http-client", 
       "path": "../node_modules/aurelia-http-client/dist/amd", 
       "main": "aurelia-http-client" 
       }, 
       { 
       "name": "aurelia-loader", 
       "path": "../node_modules/aurelia-loader/dist/amd", 
       "main": "aurelia-loader" 
       }, 
       { 
       "name": "aurelia-loader-default", 
       "path": "../node_modules/aurelia-loader-default/dist/amd", 
       "main": "aurelia-loader-default" 
       }, 
       { 
       "name": "aurelia-logging", 
       "path": "../node_modules/aurelia-logging/dist/amd", 
       "main": "aurelia-logging" 
       }, 
       { 
       "name": "aurelia-logging-console", 
       "path": "../node_modules/aurelia-logging-console/dist/amd", 
       "main": "aurelia-logging-console" 
       }, 
       { 
       "name": "aurelia-metadata", 
       "path": "../node_modules/aurelia-metadata/dist/amd", 
       "main": "aurelia-metadata" 
       }, 
       { 
       "name": "aurelia-pal", 
       "path": "../node_modules/aurelia-pal/dist/amd", 
       "main": "aurelia-pal" 
       }, 
       { 
       "name": "aurelia-pal-browser", 
       "path": "../node_modules/aurelia-pal-browser/dist/amd", 
       "main": "aurelia-pal-browser" 
       }, 
       { 
       "name": "aurelia-path", 
       "path": "../node_modules/aurelia-path/dist/amd", 
       "main": "aurelia-path" 
       }, 
       { 
       "name": "aurelia-polyfills", 
       "path": "../node_modules/aurelia-polyfills/dist/amd", 
       "main": "aurelia-polyfills" 
       }, 
       { 
       "name": "aurelia-router", 
       "path": "../node_modules/aurelia-router/dist/amd", 
       "main": "aurelia-router" 
       }, 
       { 
       "name": "aurelia-route-recognizer", 
       "path": "../node_modules/aurelia-route-recognizer/dist/amd", 
       "main": "aurelia-route-recognizer" 
       }, 
       { 
       "name": "aurelia-task-queue", 
       "path": "../node_modules/aurelia-task-queue/dist/amd", 
       "main": "aurelia-task-queue" 
       }, 
       { 
       "name": "aurelia-templating", 
       "path": "../node_modules/aurelia-templating/dist/amd", 
       "main": "aurelia-templating" 
       }, 
       { 
       "name": "aurelia-templating-binding", 
       "path": "../node_modules/aurelia-templating-binding/dist/amd", 
       "main": "aurelia-templating-binding" 
       }, 
       { 
       "name": "aurelia-templating-resources", 
       "path": "../node_modules/aurelia-templating-resources/dist/amd", 
       "main": "aurelia-templating-resources" 
       }, 
       { 
       "name": "aurelia-templating-router", 
       "path": "../node_modules/aurelia-templating-router/dist/amd", 
       "main": "aurelia-templating-router" 
       }, 
       { 
       "name": "aurelia-testing", 
       "path": "../node_modules/aurelia-testing/dist/amd", 
       "main": "aurelia-testing", 
       "env": "dev" 
       }, 
       { 
       "name": "aurelia-validation", 
       "path": "../node_modules/aurelia-validation/dist/amd", 
       "main": "aurelia-validation" 
       }, 
       { 
       "name": "bluebird", 
       "path": "../node_modules/bluebird/js/browser", 
       "main": "bluebird.min" 
       }, 
       { 
       "name": "bootstrap", 
       "path": "../node_modules/bootstrap/dist", 
       "main": "js/bootstrap.min", 
       "deps": [ "jquery", "popper.js" ], 
       "exports": "$.fn.button", 
       "resources": [ 
        "css/bootstrap.min.css" 
       ] 
       }, 
       { 
       "name": "breeze-client", 
       "path": "../node_modules/breeze-client", 
       "main": "breeze.base.min", 
       "exports": "breeze" 
       }, 
       { 
       "name": "breeze.modelLibrary", 
       "path": "../node_modules/breeze-client", 
       "main": "breeze.modelLibrary.backingStore" 
       }, 
       { 
       "name": "breeze.dataService", 
       "path": "../node_modules/breeze-client", 
       "main": "breeze.dataService.webApi" 
       }, 
       { 
       "name": "breeze.uriBuilder", 
       "path": "../node_modules/breeze-client", 
       "main": "breeze.uriBuilder.json" 
       }, 
       { 
       "name": "jquery-ui", 
       "path": "../node_modules/jquery-ui/dist", 
       "main": "jquery-ui.min", 
       "deps": [ "jquery" ], 
       "exports": "$.autocomplete", 
       "resources": [ "jquery-ui.min.css" ] 
       }, 
       { 
       "name": "popper.js", 
       "path": "../node_modules/popper.js/dist/umd", 
       "main": "popper.min", 
       "exports": "Popper" 
       }, 
       { 
       "name": "pouchdb", 
       "path": "../node_modules/pouchdb/dist", 
       "main": "pouchdb.min" 
       }, 
       { 
       "name": "toastr", 
       "path": "../node_modules/toastr", 
       "main": "toastr", 
       "deps": [ "jquery" ], 
       "resources": [ "build/toastr.min.css" ] 
       } 
      ] 
      } 
     ] 
     } 
    }