json - 部署 Aurelia/Node 应用程序时需要什么？

Question

我已经构建了一个 Aurelia 应用程序，但我不确定需要将哪些内容推送到生产服务器。我已经阅读了有关 Node 的内容，并且开始对它有更多的了解。如果我们只推送 dist 文件夹(捆绑文件夹)、index.html 和 package.json，服务器是否会自动使用 json 文件来拉取相应的包？或者我们是否必须在服务器的 CLI 上运行 npm install 来下载这些包？如果我们必须这样做，那么我假设我们必须对 jspm 做同样的事情。

此外，除了 json 文件之外，我们还需要将 config.js 推送到生产环境吗？

编辑

我刚刚运行 gulp export，它会生成一个包含以下内容的导出文件夹:

1. dist文件夹
2. jspm_packages 文件夹
3. config.js
4. index.html
5. favicon.ico

我复制所有这些文件并将它们投入生产。我在 main.js 上遇到的第一个错误是 404

这是我的bundles.js 文件

module.exports = {
  "bundles": {
    "dist/app-build": {
      "includes": [
        "[**/*.js]",
        "**/*.html!text",
        "**/*.css!text"
      ],
      "options": {
        "inject": true,
        "minify": true,
        "depCache": true,
        "rev": false
      }
    },
    "dist/aurelia": {
      "includes": [
        "aurelia-framework",
        "aurelia-bootstrapper",
        "aurelia-fetch-client",
        "aurelia-router",
        "aurelia-animator-css",
        "aurelia-templating-binding",
        "aurelia-polyfills",
        "aurelia-templating-resources",
        "aurelia-templating-router",
        "aurelia-loader-default",
        "aurelia-history-browser",
        "aurelia-logging-console",
        "bootstrap",
        "bootstrap/css/bootstrap.css!text",
        "fetch",
        "jquery"
      ],
      "options": {
        "inject": true,
        "minify": true,
        "depCache": false,
        "rev": false
      }
    }
  }
};

我很困惑为什么它没有加载我的 nprogress 栏。我在搜索 appName/jspm_packages/github/rstacruz-nprogress 时收到 404。为什么它不自动将其配置为捆绑/导出？如何将其修复为自动包含我引入的所有库的位置？

Answer 1

运行命令gulp export。它将捆绑应用程序并将必要的文件(index.html、config.js 等)复制到 export 文件夹。然后，只需将导出文件夹复制到服务器即可。生产环境中无需安装软件包。

编辑

当您安装一个软件包(例如 nprogress)时，您必须将其包含到捆绑文件之一中。 bundle 在 build/bundles.js 中配置。 aurelia 导航骨架配置了 2 个 bundle ，一个用于 aurelia 库，另一个用于应用程序的其余部分。如果需要，您还可以创建更多 bundle 。要将包添加到捆绑文件中，只需将其名称添加到特定数组中，例如:

//...
"dist/aurelia": {
      "includes": [
        "aurelia-framework",
        "aurelia-bootstrapper",
        "aurelia-fetch-client",
        "aurelia-router",
        "aurelia-animator-css",
        "aurelia-templating-binding",
        "aurelia-polyfills",
        "aurelia-templating-resources",
        "aurelia-templating-router",
        "aurelia-loader-default",
        "aurelia-history-browser",
        "aurelia-logging-console",
        "bootstrap",
        "bootstrap/css/bootstrap.css!text",
        "fetch",
        "jquery",
        "nprogress"
      ],
//...

在上面的示例中，我将 nprogress 添加到 aurelia 包中。您可以将其添加到 app-build bundle 中，甚至可以为 nprogress 创建另一个 bundle 。

现在，当您运行gulp export时，nprogress将被捆绑到aurelia-######.js文件中，并且它将准备在生产中工作。