aurelia-forms 捆绑问题 aurelia-cli

Question

我正在尝试在 Aurelia\Aspnetcore\Typescript 项目中使用 Aurelia-Form 插件。

不幸的是，我在使用 aurelia-cli 构建过程时遇到了一个问题，其中 aurelia-form 组件未正确捆绑。

Bundling progress

左边是应该怎么做的（项目取自这里https://github.com/SpoonX/swan-example-client）。

我认为我的 aurelia.json 中可能有错误，但我看不到任何可疑之处。

{
  "name": "AuFormsEx",
  "type": "project:application",
  "platform": {
    "id": "aspnetcore",
    "displayName": "ASP.NET Core",
    "output": "wwwroot\\scripts",
    "baseUrl": "scripts"
  },
  "transpiler": {
    "id": "typescript",
    "displayName": "TypeScript",
    "fileExtension": ".ts",
    "dtsSource": [
      "./typings/**/*.d.ts",
      "./custom_typings/**/*.d.ts"
    ],
    "source": "src\\**\\*.ts"
  },
  "markupProcessor": {
    "id": "none",
    "displayName": "None",
    "fileExtension": ".html",
    "source": "src\\**\\*.html"
  },
  "cssProcessor": {
    "id": "none",
    "displayName": "None",
    "fileExtension": ".css",
    "source": "src\\**\\*.css"
  },
  "editor": {
    "id": "visualstudio",
    "displayName": "Visual Studio"
  },
  "unitTestRunner": {
    "id": "none",
    "displayName": "None"
  },
  "paths": {
    "root": "src",
    "resources": "src\\resources",
    "elements": "src\\resources\\elements",
    "attributes": "src\\resources\\attributes",
    "valueConverters": "src\\resources\\value-converters",
    "bindingBehaviors": "src\\resources\\binding-behaviors"
  },
  "build": {
    "targets": [
      {
        "id": "aspnetcore",
        "displayName": "ASP.NET Core",
        "output": "wwwroot\\scripts",
        "baseUrl": "scripts"
      }
    ],
    "loader": {
      "type": "require",
      "configTarget": "vendor-bundle.js",
      "includeBundleMetadataInConfig": "auto",
      "plugins": [
        {
          "name": "text",
          "extensions": [
            ".html",
            ".css"
          ],
          "stub": true
        }
      ]
    },
    "options": {
      "minify": "stage & prod",
      "sourcemaps": "dev & stage"
    },
    "bundles": [
      {
        "name": "app-bundle.js",
        "source": [
          "[**/*.js]",
          "**/*.{css,html}"
        ]
      },
      {
        "name": "vendor-bundle.js",
        "prepend": [
          "node_modules/bluebird/js/browser/bluebird.core.js",
          "wwwroot\\scripts/require.js"
        ],
        "dependencies": [
          "aurelia-binding",
          "aurelia-bootstrapper",
          "aurelia-dependency-injection",
          "aurelia-event-aggregator",
          "aurelia-framework",
          "aurelia-history",
          "aurelia-history-browser",
          "aurelia-loader",
          "aurelia-loader-default",
          "aurelia-logging",
          "aurelia-logging-console",
          "aurelia-metadata",
          "aurelia-pal",
          "aurelia-pal-browser",
          "aurelia-path",
          "aurelia-polyfills",
          "aurelia-route-recognizer",
          "aurelia-router",
          "aurelia-task-queue",
          "aurelia-templating",
          "aurelia-templating-binding",
          "aurelia-fetch-client",
          "extend",
          "aurelia-view-manager",
          {
            "name": "aurelia-validation",
            "path": "../node_modules/aurelia-validation/dist/amd",
            "main": "index"
          },
          {
            "name": "validate.js",
            "path": "../node_modules/validate.js",
            "main": "validate"
          },
          {
            "name": "aurelia-validatejs",
            "path": "../node_modules/aurelia-validatejs/dist/amd",
            "main": "aurelia-validatejs"
          },
          {
            "name": "aurelia-form",
            "path": "../node_modules/aurelia-form/dist/amd",
            "main": "aurelia-form",
            "resources": [
              "component/**/*.html"
            ]
          },
          "jquery",
          {
            "name": "bootstrap",
            "path": "../node_modules/bootstrap/dist",
            "main": "js/bootstrap.min",
            "deps": [ "jquery" ],
            "exports": "$",
            "resources": [
              "css/bootstrap.css"
            ]
          },
          {
            "name": "text",
            "path": "../wwwroot\\scripts/text"
          },
          {
            "name": "aurelia-templating-resources",
            "path": "../node_modules/aurelia-templating-resources/dist/amd",
            "main": "aurelia-templating-resources"
          },
          {
            "name": "aurelia-templating-router",
            "path": "../node_modules/aurelia-templating-router/dist/amd",
            "main": "aurelia-templating-router"
          },
          {
            "name": "aurelia-testing",
            "path": "../node_modules/aurelia-testing/dist/amd",
            "main": "aurelia-testing",
            "env": "dev"
          }
        ]
      }
    ]
  }
}

有什么想法吗？

Answer 1

如果您仍在寻找答案，我建议您将 config.json 保留为 Aurelia-CLI 创建它的方式，然后从 Visual Studio 发布到 wwwroot。看看我刚刚生成的这个。

{
  "name": "AuFormsEx",
  "type": "project:application",
  "platform": {
    "id": "aspnetcore",
    "displayName": "ASP.NET Core",
    "output": "scripts",
    "index": "index.html",
    "baseUrl": "scripts"
  },
  "transpiler": {
    "id": "typescript",
    "displayName": "TypeScript",
    "fileExtension": ".ts",
    "dtsSource": [
      "./typings/**/*.d.ts",
      "./custom_typings/**/*.d.ts"
    ],
    "source": "src/**/*.ts"
  },
  "markupProcessor": {
    "id": "none",
    "displayName": "None",
    "fileExtension": ".html",
    "source": "src/**/*.html"
  },
  "cssProcessor": {
    "id": "none",
    "displayName": "None",
    "fileExtension": ".css",
    "source": "src/**/*.css"
  },
  "editor": {
    "id": "visualstudio",
    "displayName": "Visual Studio"
  },
  "unitTestRunner": {
    "id": "none",
    "displayName": "None"
  },
  "paths": {
    "root": "src",
    "resources": "src/resources",
    "elements": "src/resources/elements",
    "attributes": "src/resources/attributes",
    "valueConverters": "src/resources/value-converters",
    "bindingBehaviors": "src/resources/binding-behaviors"
  },
  "build": {
    "targets": [
      {
        "id": "aspnetcore",
        "displayName": "ASP.NET Core",
        "output": "scripts",
        "index": "index.html",
        "baseUrl": "scripts"
      }
    ],
    "loader": {
      "type": "require",
      "configTarget": "vendor-bundle.js",
      "includeBundleMetadataInConfig": "auto",
      "plugins": [
        {
          "name": "text",
          "extensions": [
            ".html",
            ".css"
          ],
          "stub": true
        }
      ]
    },
    "options": {
      "minify": "stage & prod",
      "sourcemaps": "dev & stage"
    },
    "bundles": [
      {
        "name": "app-bundle.js",
        "source": [
          "[**/*.js]",
          "**/*.{css,html}"
        ]
      },
      {
        "name": "vendor-bundle.js",
        "prepend": [
          "node_modules/bluebird/js/browser/bluebird.core.js",
          "node_modules/requirejs/require.js"
        ],
        "dependencies": [
          "aurelia-binding",
          "aurelia-bootstrapper",
          "aurelia-dependency-injection",
          "aurelia-event-aggregator",
          "aurelia-framework",
          "aurelia-history",
          "aurelia-history-browser",
          "aurelia-loader",
          "aurelia-loader-default",
          "aurelia-logging",
          "aurelia-logging-console",
          "aurelia-metadata",
          "aurelia-pal",
          "aurelia-pal-browser",
          "aurelia-path",
          "aurelia-polyfills",
          "aurelia-route-recognizer",
          "aurelia-router",
          "aurelia-task-queue",
          "aurelia-templating",
          "aurelia-templating-binding",
          "text",
          {
            "name": "aurelia-templating-resources",
            "path": "../node_modules/aurelia-templating-resources/dist/amd",
            "main": "aurelia-templating-resources"
          },
          {
            "name": "aurelia-templating-router",
            "path": "../node_modules/aurelia-templating-router/dist/amd",
            "main": "aurelia-templating-router"
          },
          {
            "name": "aurelia-testing",
            "path": "../node_modules/aurelia-testing/dist/amd",
            "main": "aurelia-testing",
            "env": "dev"
          }
        ]
      }
    ]
  }
}

您还混合了 \\ 和 / 路径分隔符，这不是必需的。 我希望这会有所帮助。