更好的办法利用打字稿导入资源奥里利亚

我很困惑如何在优雅的方式上奥里利亚导入我自己的资源。

因为我要做那种事来导入任何东西：

import { SomeClass } from '../path/to/some/class/';

好，路径可以根据目录结构的，我真的不想写大文章所有的时间越来越多。这是一个有点难看:(

我的问题是，如果奥里利亚框架有一个支持导入的东西很容易，而不需要编写资源的所有路径

这样的：

import { SomeClass } from 'some-class';

来源

2017-03-16 Lucas de Matos Lannes

有一些方法可以避免这种情况。例如，假设您有一个名为“models”的文件夹。在这个文件夹里有几个类，比如customer.ts,product.ts等。明白了吗？对！

在src文件夹里面，创建一个文件名models.ts，在这个文件中你应该导出所有的模型。例如：

models.ts

export * from './models/product'; 
export * from './models/customer';

在你tsconfig.json，在compilerOptions内，更改为paths对象：

"paths": { 
    "*": [ 
    "./src/*" 
    ] 
}

现在，在其余该应用程序可以导入您的模型使用：

import { Product } from 'models'; 
import { Product, Customer } from 'models';

希望这有助于！

参考Aurelia bundling fails when using relative import path

来源

2017-03-16 23:47:40

这是一个很好的答案，与我写的很好地配对。这样做的一个缺点是，所有的模型都会在第一次导入'models'模块时加载。在一个足够大的应用程序中，这可能会导致问题。如果您想将您的应用程序拆分为多个功能单独的功能块，这也会导致问题。 –

是的！它可以使事情变得更容易，但应该小心使用。 –

感谢您的解决方案，@FabioLuz！这正是我所寻找的，我会小心这个缺点;） –

这真的不是一个Aurelia问题，这是一个与作为ES2015的一部分（因此是TypeScript的一部分）的import语句，您选择的模块加载程序及其配置方式有关的问题，也是您自己的选择构建您的代码库。

您的模块加载器会读取您在import语句中使用的模块名称，例如'aurelia-framework'或'../resources/custom-elements/date-picker'。

目前，没有浏览器直接支持这些import语句，因此我们利用各种模块加载器来处理此任务。一些例子是RequireJS，SystemJS或者你可以在Webpack世界中使用的各种加载器。这些提供了一些提供友好模块名称的能力。通常，这些自定义名称仅针对通过依赖关系管理器（例如NPM或JSPM）安装的应用程序的依赖性进行配置。这些友好名称以某种方式配置。

在SystemJS中，有一个config.js文件（或0.17 beta中的jspm.configjs）。这个文件可以被修改以提供你自己友好的模块名称。尽管这可能是有风险的，因为JSPM是建立在它拥有该文件的假设之上的，因此它可能会覆盖您在其中所做的任何更改。

在使用RequireJS的Aurelia CLI中，可以在aurelia.json文件中对其进行设置。这个文件被CLI覆盖的机会比JSPM更少，但它可能会发生。

所有这些被说，我不打算在这个答案中提供这些例子，因为这个问题的更好的答案是相当内省：如果你不喜欢在导入时不断输出长路径模块，那么您需要重新考虑您的深度嵌套项目组织。通过展开项目的源代码，您可能可以实现相同的目标，而无需冒险创建自定义配置。

来源

2017-03-16 18:35:12

我真的很感谢你的答案的细节。几周前我开始使用Aurelia和TypeScript，并对我在问题主题中的错误表示歉意。这两种解决方案都很好（但我希望看到一个使用Aurelia CLI的例子：D），而“内省点”对于项目组织的思考很有用。感谢您对ES2015 +模块装载机的解答和解释。 –

更好的办法利用打字稿导入资源奥里利亚

回答

相关问题