从 background.js 创建 window 时，有没有办法将 link 到另一个目录中的 html 文件？

Question

我正处于创建 Chrome 应用程序的早期阶段，我计划将其部署到 Chrome 网上商店。我在应用程序文件夹中有一个有效的清单、index.html、index.css、properties.css 和 background.js 文件。在 background.js 文件中，我有一个 "event handler" 等待应用程序启动。然后它创建一个 window，body 为 index.html。问题是 background.js 文件与 index.html 文件夹位于不同的文件夹中。这是我的应用程序文件夹的层次结构：

My app Name

   images

      My app icon.png

   index

      index.html

      index.css

   scripts

      background.js

   styles

      properties.css

   manifest.json

每当我尝试 link 到 index.html 文件时，它都会失败。当应用程序启动时，它只会创建一个空白 window。我把它们放在单独的文件夹中以便组织，如果没有办法，我就把它们放在一起。

我已经检查了控制台是否有错误。有none.
我试过 html 方法：../index/index.html。它不起作用（aww man）。

注意： 我计划添加一个标题 div 作为标题栏，因为当我创建 window 时，我将禁用默认一个。

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

我应该看到一个是 view-port 高度 10% 的条形，但我只看到一个空的 window。

Answer 1

我想你可以替换这个：

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create("../index/index.html", {
    id: 'main',
    bounds: { width: 620, height: 500 }
  });
});

与：

chrome.app.runtime.onLaunched.addListener(function() {
  chrome.app.window.create("index/index.html", {
    id: 'main',
    bounds: { width: 620, height: 500 }
  });
});

基本上 index/index.html

之前不需要那些 ../

从 background.js 创建 window 时，有没有办法将 link 到另一个目录中的 html 文件？

Is there a way to link to a html file in another directory when creating a window from background.js?

javascript

html

google-chrome-app