在 Cordova 应用程序中使用 Aurelia UX(无法为 iOS 构建)

Using Aurelia UX in a Cordova application (fails to build for iOS)

我使用 Aurelia CLI (v0.32, Typescript, Require.JS) + Aurelia UX (v0.6.0) 构建了一个网络应用程序。使用 Brett Nelson tip,我正在为 Cordova (v8.0.0) 构建此网络应用程序。在浏览器平台 (cordova run browser) 中 运行 时一切正常,但在 IOS (cordova run ios)

中 运行 时失败

这里是错误:

我很惊讶地发现只有 Aurelia UX 依赖项(core 除外)加载失败。我怀疑 require.js 或依赖项名称中的 @ 符号有问题。

这是我在 aurelia.json

中声明依赖项的方式
{
  "name": "@aurelia-ux/core",
  "path": "../node_modules/@aurelia-ux/core/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/button",
  "path": "../node_modules/@aurelia-ux/button/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/input",
  "path": "../node_modules/@aurelia-ux/input/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/icons",
  "path": "../node_modules/@aurelia-ux/icons/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/form",
  "path": "../node_modules/@aurelia-ux/form/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/checkbox",
  "path": "../node_modules/@aurelia-ux/checkbox/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/radio",
  "path": "../node_modules/@aurelia-ux/radio/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/datepicker",
  "path": "../node_modules/@aurelia-ux/datepicker/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/textarea",
  "path": "../node_modules/@aurelia-ux/textarea/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},
{
  "name": "@aurelia-ux/chip-input",
  "path": "../node_modules/@aurelia-ux/chip-input/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{css,html}"
  ]
},

然后我如何从 main.ts 文件中调用它们

aurelia.use
  .standardConfiguration()
  .plugin('aurelia-animator-css')
  .plugin('@aurelia-ux/core')
  .plugin('@aurelia-ux/form')
  .plugin('@aurelia-ux/button')
  .plugin('@aurelia-ux/input')
  .plugin('@aurelia-ux/icons')
  .plugin('@aurelia-ux/checkbox')
  .plugin('@aurelia-ux/radio')
  .plugin('@aurelia-ux/textarea')
  .plugin('@aurelia-ux/datepicker')
  .plugin('@aurelia-ux/chip-input')

如何避免 Aurelia UX 依赖项的问题?

问题来自捆绑包中包含的资源。为了使 bundle 在 Cordova 中正常工作,我们必须明确提及对每个插件中包含的所有 JS 文件的引用。 aurelia.json 中每个插件的资源密钥必须如下所示:"resources": ["**/*.{js,css,html}"](带有 js,)部分。

最终 aurelia.json 文件:

{
  "name": "@aurelia-ux/core",
  "path": "../node_modules/@aurelia-ux/core/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/button",
  "path": "../node_modules/@aurelia-ux/button/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/input",
  "path": "../node_modules/@aurelia-ux/input/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/icons",
  "path": "../node_modules/@aurelia-ux/icons/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/form",
  "path": "../node_modules/@aurelia-ux/form/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/checkbox",
  "path": "../node_modules/@aurelia-ux/checkbox/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/radio",
  "path": "../node_modules/@aurelia-ux/radio/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/datepicker",
  "path": "../node_modules/@aurelia-ux/datepicker/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/textarea",
  "path": "../node_modules/@aurelia-ux/textarea/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},
{
  "name": "@aurelia-ux/chip-input",
  "path": "../node_modules/@aurelia-ux/chip-input/dist/amd",
  "main": "index",
  "resources": [
    "**/*.{js,css,html}"
  ]
},