Error following HOWTO Step by Step guide

[smansker]

I am trying to follow the HOWTO guide, and add aurelia-slickgrid to a typescript/requirejs project, and I keep getting an error when it attempts to render the grid.

Here's a screenshot of the error I'm getting:

I started with a new Aurelia application, using aurelia-cli 2.0.2, and chose the following configuration:

1. au new my-app --here
2. Custom Project
3. App
4. CLI's built-in bundler with an AMD module loader
5. RequireJS
6. Web
7. Typescript
8. None (HTML template)
9. Sass
10. None (PostCSS Processing)
11. Karma + Jasmine
12. None (E2E testing)
13. Visual Studio Code
14. Minimum
15. No (Docker)
16. Yes, use npm

I tried to follow the guide as much as possible, but I had to make a couple of changes. I'm loading the bootstrap.bundle to avoid the popper.js dependency error. I also loaded the css files for fontawesome and the slickgrid bootstrap theme into the vendor bundle.

Here's the project I used.

Project.zip

Am I missing something important?

Thanks

[ghiscoding]

Can you try the aurelia-slickgrid-demos - RequireJS instead, it was recently rebuilt by @zewa666 a month ago with the new Aurelia CLI 2.x. Another good thing to know is that nearly all packages are now being auto-detected without the need to add them to the aurelia.json file (there are still 2 or 3 exceptions), you can see it here. I was just swamped and forgot to update the HOWTO Wiki. I'll update it soon.

Can you give that a try please, and also know that I won't download the zip (better play safe 😉 especially on a work computer), the Aurelia-Slickgrid-Demo is the way to go.

Cheers

[smansker]

That got it! Thanks!

I removed the following from the aurelia.json, and it started working:

      {
        "name": "flatpickr",
        "path": "../node_modules/flatpickr/dist",
        "main": "flatpickr.min",
        "resources": ["flatpickr.min.css"]
      },
      {
        "name": "slickgrid",
        "main": "slick.grid",
        "path": "../node_modules/slickgrid",
        "deps": [
          "jquery",
          "jquery-ui-dist"
        ]
      },
      {
        "name": "jszip",
        "path": "../node_modules/jszip/dist",
        "main": "jszip.min"
      },
      {
        "name": "excel-builder-webpacker",
        "path": "../node_modules/excel-builder-webpacker",
        "main": "dist/index",
        "deps": [
          "jszip",
          "lodash"
        ]
      }

Good point on the zip file. Thanks again for your help!

[ghiscoding]

I updated the HOWTO Wiki, let me know if you spot any errors.

Thanks for the feedback ⭐