Я на начальной стадии создания приложения Chrome, которое планирую развернуть в интернет-магазине Chrome. У меня есть допустимые файлы манифеста, index.html, index.css, properties.css и background.js в папке приложения. В файле background.js у меня есть «обработчик событий», который ожидает запуска приложения. Затем он создает окно с телом index.html. Проблема в том, что файл background.js находится в другой папке, чем папка index.html. Вот иерархия папок моего приложения:
My app Name<br>
images<br>
My app icon.png<br>
index<br>
index.html<br>
index.css<br>
scripts<br>
background.js<br>
styles<br>
properties.css<br>
manifest.json<br>
Всякий раз, когда я пытаюсь сделать ссылку на файл index.html, происходит сбой. Когда приложение запускается, оно просто создает пустое окно. Я храню их в отдельных папках для организации, и если нет способа сделать это, я просто соберу их вместе.
- Я проверил консоль на наличие ошибок. Их нет.
- Я попробовал html-метод: ../index/index.html. Это не работает (ооо человек).
ПРИМЕЧАНИЕ: Я планирую добавить div заголовка, который будет действовать как строка заголовка, потому что при создании окна я отключу окно по умолчанию.
background.js
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create("../index/index.html", {
id: 'main',
bounds: { width: 620, height: 500 }
});
});
manifest.json
{
"manifest_version": 2,
"name": "UI Button Designer",
"version": "1",
"icons": {
"128": "images/icon_128.png"
},
"permissions": [],
"app": {
"background": {
"scripts": ["scripts/background.js"]
}
},
"minimum_chrome_version": "28"
}
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="../styles/properties.css">
<link rel="stylesheet" type="text/css" href="index.css">
</head>
<body>
<div id="container">
<div id="header"></div>
</div>
</body>
</html>
index.css
#container {
width: 100%;
min-width: 100%;
max-width: 100%;
height: 100%;
min-height: 100%;
max-height: 100%;
margin: 0;
padding: 0;
border: none;
}
#header {
width: 100%;
height: 10%;
background-color: #fbbc05;
}
Я должен видеть полосу, которая составляет 10% высоты порта просмотра, но я просто вижу пустое окно.