Как использовать бриз в аурелии?

Я новичок в aurelia и использую проект скелета-типографа-aspnetcore для создания своего первого приложения. Скелет работает нормально, но когда я следовал руководству по плагину aurelia-breeze, чтобы интегрировать его в свое приложение, я использую

import breeze from 'breeze';

в файле ts, но есть ошибка: не удается найти модуль «бриз». Я так много гуглил, что кто-то упомянул, что файл d.ts отсутствует, и я скопировал его из git(https://github.com/jdanyow/aurelia-breeze/blob/master/dist/aurelia-breeze.d.ts) в папку typings, но d.ts возникла другая ошибка в первой строке, не удается найти модуль «бриз-клиент»:

import breeze from 'breeze-client';

Я проверил папку nmp (wwwroot/nmp), там есть и aurelia-breeze, и breeze-client, то же самое и в package.json.

Я сравнил файл aurelia-breeze.d.ts с другим файлом d.ts в папке typings, все файлы поставляются со скелетом, названным index.d.ts, и с typings.json для декаляции.

Так что я предполагаю, что ошибка должна быть вызвана конфигурацией типизации, и я долго гуглил, но ответа нет, можете ли вы сказать мне, как заставить это работать? заранее спасибо.

breeze aurelia

22.11.2016

Ответы:

Я не использую TypeScript в своем приложении Aurelia, но у меня была такая же проблема с интеграцией бриза. В конце концов я решил это (или, скорее, нашел этот обходной путь), добавив его как простой скрипт вместо того, чтобы загружать его из 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 для breeze после загрузки самого breeze. Хотя, вероятно, есть лучшие способы сделать это.

Также обратите внимание, что я использую «require» в качестве загрузчика модуля. Я использую интерфейс командной строки Aurelia, поэтому я установил его в файле 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"
        ],
 ...
}

02.12.2016

Чтобы использовать клиент breezejs с aurelia, вы должны сделать следующее:

Установите необходимые пакеты.

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'
      }

(требуется файл config.js и полные файлы aurelia.json, приведенные ниже)

Импортируйте и инициализируйте библиотеку в своем проекте TypeScript по мере необходимости.

import * as breeze from 'breeze-client'

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

Готово!! теперь вы можете использовать бриз. то есть

const entityManager = new
EntityManager'https://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, а также aurelia.json для сборки aurelia cli, посмотрите и обратите внимание на добавление, предварительную загрузку и прокладки.

//-------------------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" ]
              }
            ]
          }
        ]
      }
    }

03.01.2018

Новые материалы

Как создать диаграмму градиентной кисти с помощью D3.js

Резюме: Из этого туториала Вы узнаете, как добавить градиентную кисть к диаграмме с областями в D3.js. Мы добавим градиент к значениям SVG и применим градиент в качестве заливки к диаграмме с..

Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что это выглядит сложно…

Просто начните и учитесь самостоятельно Я хотел выучить язык программирования MVC4, но не мог выучить его раньше, потому что он кажется мне сложным, и я бросил его. Это в основном инструмент..

Лицензии с открытым исходным кодом: руководство для разработчиков и создателей

В динамичном мире разработки программного обеспечения открытый исходный код стал мощной парадигмой, способствующей сотрудничеству, инновациям и прогрессу, движимому сообществом. В основе..

Объяснение документов 02: BERT

BERT представил двухступенчатую структуру обучения: предварительное обучение и тонкая настройка. Во время предварительного обучения модель обучается на неразмеченных данных с помощью..

Как проанализировать работу вашего классификатора?

Не всегда просто знать, какие показатели использовать С развитием глубокого обучения все больше и больше людей учатся обучать свой первый классификатор. Но как только вы закончите..

Работа с цепями Маркова, часть 4 (Машинное обучение)

Нелинейные цепи Маркова с агрегатором и их приложения (arXiv) Автор : Бар Лайт Аннотация: Изучаются свойства подкласса случайных процессов, называемых дискретными нелинейными цепями Маркова..

Crazy Laravel Livewire упростил мне создание электронной коммерции (панель администратора и API) [Часть 3]

Как вы сегодня, ребята? В этой части мы создадим CRUD для данных о продукте. Думаю, в этой части я не буду слишком много делиться теорией, но чаще буду делиться своим кодом. Потому что..

Метки

Machine Learning JavaScript Data Science Artificial Intelligence Software Development Python Web Development Coding Deep Learning AI React Software Engineering Nodejs Java Front End Development Typescript Computer Science Data Algorithms Development NLP Tech Programming Languages CSS ChatGPT HTML Python Programming Javascript Tips Angular Computer Vision Startup Data Visualization Neural Networks Tutorial Statistics Productivity Reactjs Learning