模块未在 Aurelia 中加载

Question

我目前在尝试使用 Aurelia 加载模块时遇到了一个奇怪的问题。我已经成功加载了moment 库以格式化日期，但是我试图以与npm install <module> --save 完全相同的方式加载numeral 库，但它试图在/dist 中找到numeral 库目录而不是模块库。

我在下面有两个 ValueConverter：

---

使用Moment的代码：

src/filters/time-format.js

import moment from 'moment';

export class TimeFormatValueConverter {
  toView(value) {
    return moment(value).format('h:mm');
  }
}

src/clock.html

<template>
  <require from="./filters/date-format"></require>
  <require from="./filters/time-format"></require>
  <section class="au-animate">
    <h2 class="clock-font-large">${time | timeFormat}</h2>
  </section>
</template>

---

代码尝试使用Numeral:

src/filters/temperature-format.js

import numeral from 'numeral';

export class TemperatureFormatValueConverter {
  toView(value) {
    return numeral(value).format('(00)');
  }
}

src/weather.html

<template>
  <require from="./filters/temperature-format"></require>
  <section class="au-animate">
    <h2 class="clock-font-large">${weather.main.temp | temperatureFormat }</h2>
  </section>
</template>

---

尝试使用numeral 查看页面时出现以下错误：

ERROR [app-router] Error: (SystemJS) XHR error (404 Not Found) loading http://clock.localhost:9000/dist/numeral.js
    Error: XHR error (404 Not Found) loading http://clock.localhost:9000/dist/numeral.js
    Error loading http://clock.localhost:9000/dist/numeral.js as "numeral" from http://clock.localhost:9000/dist/filters/temperature-format.js

为什么它试图查看/dist 目录而不是模块库？我知道依赖注入有一些中断，但我不知道该怎么办。

Answer 1

看来您正在使用 SystemJS。所以，你应该运行的是：

jspm install numeral

除非您正在做一些非常具体的事情，否则在使用 SystemJS Skeleton 时，您不必使用 NPM 安装任何包。

Answer 2

如果您使用的是 Aurelia-cli，只需将以下代码添加到 aurelia_project 文件夹中的 aurelia.json 文件中：

                {
                    "name": "numeral",
                    "path": "../node_modules/numeral",
                    "main": "numeral"
                },

在 Aurelia 中，您始终需要明确列出您的依赖项。

如果您使用的是 Skeleton 安装，请参阅 Fabio 的回答。