Using LoDash with EmberCLI

◇◆丶佛笑我妖孽 提交于 2020-01-22 13:56:25

问题


Does anyone have a working example of a (simple) ember-app project built using Ember-CLI that uses LoDash? (e.g.: I want to use lodash, _.someLodashFunc, in my Routes and Controllers).

I haven't seen any thread / article on the web that gives clear, step-by-step explanation on how to do that.

If possible with lodash v3.0.0 (and I'm using the latest ember-cli, v0.1.9).

Thanks, Raka


I found out how, you need to generate a custom build of lodash (the "lodash modern"). Use lodash-cli: https://lodash.com/custom-builds

On the command console type: lodash modern ..., and you'll get a javascript file generated: lodash.custom.js

Put that file under "vendor" dir of your ember-cli project.

Modify the Brocfile, add this:

app.import('vendor/lodash.custom.js', {
  'lodash': [
    'default'
  ]
});

And that's it.... you don't have to do "import _ from 'lodash'" in any of your js files. In fact, don't do that (you'll get an error). The _ var is readily available.

For example, I have a Route object like this:

import Ember from 'ember';

export default Ember.Route.extend({
  model: function() {
    console.log('hohoho: ' + _.chunk(['a', 'b', 'c', 'd'], 2));
    return Ember.Object.create({name: 'Raka'});
  }
});

And I could see hohoho:,b,c,d got printed in javascript console when I visited that route.

CORRECTION

You don't really need that lodash-cli.

I've tried this way (I guess more proper):

  1. bower install lodash --save
  2. In Brocfile.js, have this line: app.import('bower_components/lodash/lodash.js');

That's it. _ is automatically available in your Routers / Controllers.

I did the same with d3:

  1. bower install d3 --save
  2. In Brocfile.js, have this line: app.import('bower_components/d3/d3.js');

And variable named 'd3' is automatically available.


Added related link:

  1. Import custom library in ember-cli
  2. http://tiku.io/questions/2866484/how-to-include-a-local-javascript-im-ember-cli-application (quote: If you don't need them to minified in your vendor.js file you can put them in the public/js and then include it as a normal script file in app/index.html. I use this method for some libraries like moment.js. The public folder gets directly copied to your site root during the build.)
  3. Proper way to access third party libs such as D3 in Ember CLI?

回答1:


You can use something ready: https://github.com/levanto-financial/ember-lodash or do it manually.

I don't have any example but it should be as easy as modifying these 3 files:

bower.json

Just add the line

"lodash": "4.16.4",

to your dependencies and run bower install in your command line.

Alternatively, you can install it via bower:

$ bower install lodash --save

Brocfile.js

In order to be included to sources by Broccoli:

app.import('bower_components/lodash/lodash.js');

add this somewhere after var app = new EmberApp();

.jshint.rc

Add the line:

"_": true,

somewhere in the predef section (if you don't want to see the warnings like _ is undefined).

I haven't tested that but I hope it helps :)




回答2:


You can install the latest stable version using Bower. In your project's root directory, run:

bower install lodash --save

Then import it using Brocolli by adding this line in your Brocfile.json somewhere after var app = new EmberApp( ...:

app.import('bower_components/lodash/lodash.js');



回答3:


ember-lodash addon would be best pet.(https://www.npmjs.com/package/ember-lodash)

install addon : ember install ember-lodash

To include string functions alone

import _string from 'lodash/string';

let truncatedString = _string.trunc(rawString);

To include entire lodash library,

import _ from 'lodash/lodash';

let truncatedString = _.trunc(rawString);


来源:https://stackoverflow.com/questions/28161646/using-lodash-with-embercli

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!