如何在Ember.js上导入库? [英] How to import a library on Ember.js?
问题描述
我目前正在使用Ember.js。
I am currently working with Ember.js.
我在将一些库导入我的应用程序时遇到了一些问题。首先我下载了这个图书馆 http://www.acme.com/javascript/Clusterer2.js之后我正在阅读导入Javascript <的所有文档。 / A>。
但我的主要问题是我仍然不知道如何使用它。我正在搜索,经过长时间的工作后,我发现你在模板中的application.hbs中使用 ember g模板应用程序
生成了该文件夹〜\\\模板我必须通过此操作拨打电话:
I have some issues importing some library into my application. First I downloaded this library http://www.acme.com/javascript/Clusterer2.js after that I was reading all the documentation in this Importing Javascript.
But my main problem is I still don't know how to use it. I was searching and after long hours I found that in the application.hbs in the template that you generate with ember g template application
that is in the folder ~\app\templates I have to make a call with this action:
{{outlet}}
{{link-to nameoftheLibrary}}
但我对此仍然不太熟悉。我无法调用我试图使用的库中的任何操作。
But I am still not much familiar with this. I can't call any action from the library that I am trying to use.
推荐答案
第一首选项:Ember Addon
优选地,您的JavaScript库将是一个余烬附加组件。然后您只需输入以下命令即可安装:
First Preference: Ember Addon
Preferably your JavaScript library will be an ember add-on. Then you can install it by simply typing:
# ember install <addon name>
这通常会处理您需要执行的所有导入。 JavaScript代码将包含在您编译的Ember应用程序中。
This will usually take care of all importing that you need to do. The JavaScript code will be included in your compiled Ember app.
如果有这是一个ember附加组件,然后你可以使用bower:
If there isn't an ember add-on, then you can use bower:
# bower install -S <bower package name>
然后你需要在 .ember-cli-build中添加依赖项
file:
Then you need to add the dependency in your .ember-cli-build
file:
/*jshint node:true*/
/* global require, module */
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
var app = new EmberApp(defaults, {
// snipped out some stuff
});
// this library is in your bower_components/somelibrary/somelibrary.js file
app.import(app.bowerDirectory + '/somelibrary/somelibrary.js');
return app.toTree();
};
最后的偏好:手动导入
如果如果您无法找到所需的库作为ember附加程序或bower程序包,则必须手动导入库。
Last Preference: Manual import
If you can't find your required library as an ember add-on or bower package, you're going to have to import the library manually.
步骤1 :将javascript文件夹保存在供应商
文件夹中
Step 1: save the javascript folder in your vendor
folder
将Clustererer2.js文件保存在文件夹中喜欢 vendor / clusterer / clusterer2.js
。
Save your Clustererer2.js file in a folder like vendor/clusterer/clusterer2.js
.
第2步:修改 .ember-cli-build
将此文件包含在已编译的Ember应用程序中
Step 2: Modify your .ember-cli-build
file to include this in your compiled Ember app
修改您的文件如下:
/*jshint node:true*/
/* global require, module */
var EmberApp = require('ember-cli/lib/broccoli/ember-app');
module.exports = function(defaults) {
var app = new EmberApp(defaults, {
// snipped out some stuff
});
app.import('vendor/clusterer/clusterer2.js');
return app.toTree();
};
第3步:让JSHint对新的全球
您将不得不对要在代码中引用的新全局变量感到高兴 jshint
。将其添加到 .jshintrc
文件中:
You're going to have to make jshint
happy about the new global variable you're going to reference in your code. Add it in your .jshintrc
file:
{
"predef": [
"document",
"window",
"-Promise",
"Clusterer"
],
"browser": true,
"boss": true,
// snipped a lot of stuff
"esnext": true,
"unused": true
}
请注意,在 - Promise
条目之后我添加 Clusterer
行?
Notice that after the "-Promise"
entry I added the Clusterer
line?
步骤4:重建Ember应用并使用新库
现在您已经在编译输出中包含了javascript文件,您应该可以在代码中引用它。
Now that you've included the javascript file in your compiled output, you should be able to reference it in your code.
这篇关于如何在Ember.js上导入库?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!