Funny, I’ve never tried to use the library we created. It’s odd that the lesson doesn’t go into how to implement it on our own. That sort of information would be immensely helpful, I’m sure.
@lilybird, anybody in curriculum willing to take on this assignment?
I’ll raise this to the team now! Thanks, guys.
Hi @eric-heim have you ever had a useful answer to this question?
I never understood how to import lodash into VS Code. My questions are:
- What exactly do I need to download from the lodash website and where do I need to save it locally?
- Do I have to do something at the beginning of every .js file if I want to use lodash in or is there a way to ‘install’ lodash and have it always available for any project I start?
It would be great if someone could explain this in detail to me (perhaps @lilybird could you help or put me in touch with someone that could?).
Hi @brandas, the most straightforward way to use Lodash in projects that you are developing on your own is by adding a
<script> tag into the
<head> of your index.html file that links to Lodash via a Content Delivery Network (CDN), like so (this is also shown at the top of this project’s intro):
<head> <script src="https://firstname.lastname@example.org/lodash.min.js"></script> <!-- Make sure that you load lodash before the file that uses it. --> <script src="file-that-uses-lodash.js"></script> </head>
You can also download the code directly by:
- Going to the lodash website
- Clicking on the Core Build (or full build) link
- Saving the file (Ctrl + S or CMD + S) as lodash.js and moving it into your project’s root folder.
- Referencing the local lodash.js file like so:
<head> <script src="lodash.js"></script> <!-- Make sure that you load lodash before the file that uses it. --> <script src="file-that-uses-lodash.js"></script> </head>
I hope this helps but let us know if you could use some further clarification!
Thanks a lot! This is very clear and helpful!
Just one more question… Let’s say I’m only doing some js exercises and that my project only has a .js file. Can I still use the Lodash methods even if I don’t have an index.html file?
@brandas - The short answer is yes but it depends on how you are running that .js file on your computer. One easy way to run your code is by running it in a browser. To do this you can:
- Create an index.html file with just the code from the first code snippet. Make sure its in the same folder as your .js file.
- Open up your favorite browser (I recommend Chrome) and open the index.html file (Ctrl + O or CMD +O).
- If you are using
console.log()statements you can see them by opening up the Developer tools.
The alternative (using Node in the terminal) involves some other syntax which is outlined in the website
Thanks again @bspex. I use VS Code and I have the Code Runner extension which allows me to run my .js files.
Gotcha. Using the Code Runner extension will require the same steps as if you are using node. Here’s an article explaining how to set up Node if you haven’t already.
Open the VS Code terminal and install
lodash using the
npm commands below:
npm install -g lodash npm install --save lodash
Then, in your .js file you can load lodash using
var _ = require('lodash'); console.log(_.toUpper('hello world')); // Prints HELLO WORLD
require() will automatically look in a special folder where packages downloaded via
npm are stored called
node_modules. You can also use it to reference locally downloaded files. This means that if you had downloaded the lodash.js file directly, you could use it like so:
var _ = require('./lodash.js'); console.log(_.toUpper('hello world')); // Prints HELLO WORLD
Hi @bspex this worked!! Thanks a lot
So just to make sure, from now on, every time I want to use Lodash on a js file I just include
var _ = require('lodash'); at the beginning and I’m good to go. Otherwise, if I have an index.html I use the code that links to lodash via CDN. Is this correct?
Exactly! Though I want to clarify something that depending on where you are in your learning may not make sense:
-g part in the command
npm install -g lodash is a “global” flag, meaning that it will install lodash into a
node_modules folder for your entire computer so every project will be able to access that package.
That being said, as explained in this StackOverflow post, typically, you should install project-specific packages like this WITHOUT the
-g flag which installs it locally into the working directory. In this way, you would have to install it for each project that uses lodash.
Understood. Thank you so much for your help!