Для первой попытки запустить этот процесс проще всего использовать все статические файлы просто для простоты.После запуска приложения из статических файлов html и js можно выполнить миграцию для использования пружинных страниц mvc и jsp.
Для начала убедитесь, что в папке webapp есть папка с именем resources, при условии, что webappродительский элемент существующей папки WEB-INF.
Базовая структура начальной папки для использования статической html-страницы будет выглядеть следующим образом:
webapp
- resources
-- app
-- css
--- ext-all.css
-- sass
-- themes
- WEB-INF
-- spring
-- classes
-- views
index.html
app.js
ext-all-debug.js
В WEB-INF, скорее всего, есть папка spring сфайл mvc-config.xml или аналогичный.В этом конфигурационном файле папка ресурсов должна быть предназначена для обслуживания статического контента с помощью тега ресурсов.Скорее всего, первый тег, управляемый mvc: annotation, уже есть в файле конфигурации, как показано ниже.Добавьте тег ресурсов, указанный ниже, в файл конфигурации.
<!-- Configures support for @Controllers -->
<mvc:annotation-driven />
<!-- Handles HTTP GET requests for /resources/** by efficiently serving up static resources in the ${webappRoot}/resources directory -->
<resources mapping="/resources/**" location="/resources/" />
Благодаря этому папка ресурсов может обслуживать файл index.html так же, как в примере с Sencha.
Всеэто настраивает вас на возможность создания первого примера из URL-адреса, например: http://localhost:8080/resources/index.html
При загрузке и распаковке ZIP-архив Ext JS содержит папку ресурсов.Скопируйте подпапки этой папки в папку webapp / resources.Также скопируйте ext-all.debug.js в папку webapp / resources.
Затем создайте index.html в webapp / resources с этим содержанием, аналогичным учебному пособию Sencha:
<html>
<head>
<title>Static Account Manager</title>
<link rel="stylesheet" type="text/css" href="./css/ext-all.css">
<script type="text/javascript" src="./ext-all-debug.js"></script>
<script type="text/javascript" src="./app.js"></script>
</head>
<body></body>
</html>
СоздатьФайл app.js находится в папке webapp / resources, как показано в следующем фрагменте, и его достаточно, чтобы его можно было запустить и запустить с одной панелью, настроенной в app.js.С этого момента руководство достаточно просто перенести на эту настройку.
Ext.application({
name: 'AM',
appFolder: 'app',
launch: function() {
Ext.create('Ext.container.Viewport', {
layout: 'fit',
items: [
{
xtype: 'panel',
title: 'Users',
html : 'List of users will go here'
}
]
});
}
});
После того, как статический html-файл работает правильно, можно использовать jsp из папки просмотра и иметь такой контент:
<html>
<head>
<title>JSP Account Manager</title>
<link rel="stylesheet" type="text/css" href="./resoures/css/ext-all.css">
<script type="text/javascript" src="./resoures/ext-all-debug.js"></script>
<script type="text/javascript" src="./resoures/app.js"></script>
</head>
<body></body>
</html>