• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

I Like Kill Nerds

The blog of Australian Front End / Aurelia Javascript Developer & brewing aficionado Dwayne Charrington // Aurelia.io Core Team member.

  • Home
  • Aurelia 2
  • Aurelia 1
  • About
  • Aurelia 2 Consulting/Freelance Work

Using Lodash With An Aurelia CLI Requirejs Project

Aurelia 1 · July 1, 2016

Even though I primarily use Webpack for a massive Aurelia project I am working on, I am doing a fun internal project at work and decided to try out the Requirejs based Aurelia CLI. Not only is it fast, but incredibly easy to get a project setup from scratch without worrying about the messiness of using a skeleton.

One issue I encountered with trying to use Lodash with my Requirejs based project was simply importing it inside of my template wasn’t enough. It wasn’t being included in the bundle. Because Lodash in particular installed via Npm has no dist folder or real main entry, you need to tell the CLI where to find the right file.

Firstly just install the library by running npm install lodash --save in your project directory. If you are using TypeScript, then you’ll want to install the typings for Lodash or it will complain about not knowing about Lodash being a module by typing: typings install lodash --save

Now you have Lodash installed and the typings (if you’re using TypeScript) finally go into the aurelia_project directory and open up the aurelia.json file inside of it. Scroll down to the bottom until you see an array called bundles which has all of our bundled dependencies.

You should probably see a dependency in the vendor bundle that looks like this already:

{
    "name": "aurelia-testing",
    "path": "../node_modules/aurelia-testing/dist/amd",
     "main": "aurelia-testing",
     "env": "dev"
},

Underneath it simply put the following:

{
    "name": "lodash",
    "path": "../node_modules/lodash",
    "main": "lodash.min"
}

This will tell the bundler to add the minified version of Lodash into your vendor-bundle.js file and that’s it. You might find yourself needing to do this for library based dependencies like this, so keep this in mind if using the Requirejs based Aurelia CLI.

Dwayne

Leave a Reply Cancel reply

2 Comments
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Vítor Castro
Vítor Castro
6 years ago

Hi,
I’m too ‘playing’ around in a small project using aurelia CLI. But I’m having problems referencing libraries like circular-json, I suspect that they aren’t following the standards.
Have you tried anything like this?

0
Socrates
Socrates
6 years ago

I would like to know how to load css font-awesome, for example, from the installation by NMP in a aurelia-cli project

0

Primary Sidebar

Popular

  • Testing Event Listeners In Jest (Without Using A Library)
  • How To Get The Hash of A File In Node.js
  • Waiting for an Element to Exist With JavaScript
  • Thoughts on the Flipper Zero
  • How To Get Last 4 Digits of A Credit Card Number in Javascript
  • How To Paginate An Array In Javascript
  • Reliably waiting for network responses in Playwright
  • How To Mock uuid In Jest
  • How to Copy Files Using the Copy Webpack Plugin (without copying the entire folder structure)
  • NBN Box Installed Inside of Garage, Where Do You Put The Modem?

Recent Comments

  • Dwayne on Is Asking Developers How to Write FizzBuzz Outdated?
  • kevmeister68 on Is Asking Developers How to Write FizzBuzz Outdated?
  • Kevmeister68 on Start-Ups and Companies That Embrace Work From Anywhere Will Be More Likely to Survive the Coming Recession in 2023
  • kevmeister68 on What Would Get People Back Into the Office?
  • Dwayne on PHP Will Not Die

Copyright © 2023 · Dwayne Charrington · Log in

wpDiscuz