EmberJS - 管理依赖关系


Ember 使用 NPM 和 Bower 来管理依赖项,这些依赖项在 NPM 的 package.json 和 Bower 的Bower.json中定义。例如,在开发 Ember 应用程序时,您可能需要为样式表安装 Ember 未安装的 SASS。为此,请使用Ember Addons来共享可重用库。如果您想安装任何 CSS 框架或 JavaScript 日期选择器依赖项,请使用 Bower 包管理器。

插件

Ember CLI可用于通过使用以下命令来安装 Ember Addons -

ember install ember-cli-sass

ember install 命令会将所有依赖项保存到相应的配置文件中。

鲍尔

它是一个 Web 包管理器,用于管理 HTML、CSS、JavaScript 或图像文件的组件。它基本上维护和监视所有包并检查新更新。它使用配置文件Bower.json来跟踪放置在 Ember CLI 项目根目录下的应用程序。

您可以使用以下命令安装项目依赖项 -

bower install <dependencies> --save

资产

您可以将无法作为 Addon 或 Bower 包提供的第三方 JavaScript 放在项目的供应商/文件夹中,并将自己的资源(例如 robots.txt、favicon 等)放在项目的public/文件夹中。开发 Ember 应用程序时 Ember 未安装的依赖项应使用清单文件ember-cli-build.js包含在内。

AMD JavaScript 模块

您可以将资产路径作为第一个参数,将模块和导出列表作为第二个参数。您可以将这些资产包含在ember-cli-build.js清单文件中,如下所示:

app.import('bower_components/ic-ajax/dist/named-amd/main.js', {
   exports: {
      'ic-ajax': [
         'default',
         'defineFixture',
         'lookupFixture',
         'raw',
         'request'
      ]
   }
});

环境特定资产

通过将对象定义为第一个参数(环境名称),可以在不同的环境中使用不同的资产,并且对象的值应在该环境中用作资产。在ember-cli-build.js清单文件中,您可以包含如下内容:

app.import ({
   development: 'bower_components/ember/ember.js',
   production:  'bower_components/ember/ember.prod.js'
});

其他资产

将所有资源放入public/文件夹后,它们将被复制到 dist/ 目录中。例如,如果您复制放置在public/images/favicon.ico文件夹中的图标,该图标将被复制到dist/images/favicon.ico目录中。可以在供应商/文件夹中手动添加第三方资源,或者通过import()选项使用 Bower 包管理器。未使用import()选项添加的资源将不会出现在最终构建中。

例如,考虑以下代码行,它将资产导入到dist/文件夹中。

app.import('bower_components/font-awesome/fonts/fontawesome-webfont.ttf');

上面的代码行在dist/font-awesome/fonts/fontawesomewebfont.ttf中创建一个字体文件。您还可以将上述文件放置在不同的路径中,如下所示 -

app.import('bower_components/font-awesome/fonts/fontawesome-webfont.ttf', {
   destDir: 'assets'
});

它将复制dist/assets/fontawesome-webfont.ttf中的字体文件。