Интеграция сборки приложения extjs 5 с sencha cmd и WebAPI в Visual Studio

Я новичок в ExtJs и хочу интегрировать приложение ExtJs 5, созданное с помощью Sencha CMD, в приложение WebAPI!

Я сделал интеграцию для режима BUILD, но не для режима DEVELOPMENT.

Что касается этого post шаги интеграции выполняются, как показано ниже!

  • Шаг 1. Создание пути: C:\VCProject\SVCodeCampWeb\WebAPI

  • Шаг 2. Создание проекта WebAPI с именем «API_NAME» в каталоге шага 1.

  • Шаг 3. Перемещение фреймворка ExtJS 5 (ext-5.0.0) в каталог шага 1.

  • Шаг 4. Создание приложения extjs с помощью sencha cmd:

    C:\VCProject\SVCodeCampWeb\WebAPI\ext-5.0.0>sencha generate app MyApp C:\VCProject\SVCodeCampWeb\WebAPI\API_NAME\API_NAME\CMDBUG1

  • Шаг 5. Включение приложения ext в Web Api через обозреватель решений.

  • Шаг 6. Создание приложения с помощью sencha cmd, как показано ниже:

    C:\Users\albert\Documents\Visual Studio 2013\Projects\BMSIA\BMSIA.Web\BMSJS>sencha app build

РАБОТАЕТ!!! Это файлы, которые я включил в свой _Layout.chtml режима WebAPI для BUILD, и он работает!

<script src="~/CMDBUG1/build/production/MyApp/app.js"></script>
<link href="~/CMDBUG1/build/production/MyApp/resources/MyApp-all.css" rel="stylesheet" />

НЕПРАВИЛЬНЫЙ РАЗДЕЛ!!!

И для режима РАЗРАБОТКИ я включаю эти файлы:

< link href="~/CMDBUG1/build/production/MyApp/resources/MyApp-all.css" rel="stylesheet" />

< script src="~/CMDBUG1/ext/ext-all.js"></script>

< script src="~/CMDBUG1/app.js"></script>

Но выдает эту ошибку:

TypeError: Ext.application is not a function

Если вам нужна дополнительная информация, дайте мне знать!

Любая помощь будет оценена!


asp.net-web-api extjs5
person Albert    schedule 01.10.2014    source источник

Ответы (1)


arrow_upward
2
arrow_downward

Нет необходимости задавать для .js и .css значение _Layout.cshtml. Когда вы создаете свое приложение с помощью Sencha CMD, вы получаете index.html, app.js, resources/App-all.css и некоторые изображения. Цель состоит в том, чтобы это приложение могло работать в любом месте в домене приложения (или в другом домене, если применяется CORS). Web Api предоставит URI, которые вызовет ваше приложение. Таким образом, вы отделяете клиентское приложение (extjs) от сервера (webapi), даже если они находятся в одном проекте. И все это будет работать, если вы, например, предоставите разные webapi для своего приложения. Следует иметь в виду, что baseUri. Пока вы разрабатываете, это будет http://localhost:xxxx, а когда приложение будет развернуто, оно будет http://www.somedomain.com. Я использую простой одноэлементный класс, в котором я устанавливаю свои пути разработки и производства. Это необходимо, чтобы ваши вызовы ajax из models/stores/ext.ajax имели действительный путь к вашему API. Общая цель состоит в том, чтобы отделить клиент и webapi. Вы можете поместить созданное приложение в папку /app и сохранить код extjs в папке /source, которую затем можно исключить из публикации.

Ext.define('MyApp.config.AppConfig', {
    statics: {
        path: 'http://localhost:8888'
        //path: 'http://client1.azurewebsites.net',
        //path: 'http://client2.azurewebsites.net'
    }
});

а потом при вызове апи говоришь: url:MyApp.config.AppConfig.path + /users/list. Это можно сделать красиво, конечно.

person Davor Zubak    schedule 10.12.2014