l-lin / angular-datatables

DataTables with Angular
https://l-lin.github.io/angular-datatables/
MIT License
1.57k stars 481 forks source link

Cannot read properties of undefined (reading 'options') when attempting to install angular data-tables. #1788

Closed IMeyers2020 closed 2 months ago

IMeyers2020 commented 2 months ago

Hi there, I am in the process of updating my Angular app from v14 to v17. One step I am taking while doing this is to upgrade angular-datatables. Upon running ng add angular-datatables I get an error related to undefined options. Here is the full terminal log:

PS C:\Users\IM010907\Documents\git\Dashboard\ID_Client> npm run add-datatables

> icm@1.0.0 add-datatables
> ng add angular-datatables

? Would you like to share pseudonymous usage data about this project with the Angular Team
at Google under Google's Privacy Policy at https://policies.google.com/privacy. For more  
details and how to change this setting, see https://angular.io/analytics. No
Global setting: not set
Local setting: disabled
Effective status: disabled
ℹ Using package manager: npm
✔ Found compatible package version: angular-datatables@17.0.0.
✔ Package information loaded.

The package angular-datatables@17.0.0 will be installed and executed.
Would you like to proceed? Yes
✔ Packages successfully installed.
? Which styling library would you like to use for DataTables? Bootstrap 5
    Your project needs Bootstrap CSS installed and configured for changes to take affect.
    ℹ️  Skipped adding "jquery" into package.json
    ✅️ Added "datatables.net" into "dependencies"
    ✅️ Added "@types/jquery" into "devDependencies"
    ✅️ Added "datatables.net-bs5" into "dependencies"
    🔍 Installing packages...
Cannot read properties of undefined (reading 'options')

I have tried...

I made a StackOverflow issue and there was one person saying it is possibly related to NX

IMeyers2020 commented 2 months ago

I did notice in the source code that the parsing to add to angular.json seems to be somewhat assuming only one project? It has the 0 indexing to make this work, but doesn't allow the user to choose what project to build from. I think this is causing my issue, as my first project.architect doesn't use the build property image

IMeyers2020 commented 2 months ago

The issue was that I have multiple projects, angular.json seemed to be ordered alphabetically automatically, but my main project (the one with build options) was not at index 0. Because of this, the line I highlighted above accesses a project that only needed lint and test configuration. This was causing the error that I was getting. Upon moving my main project to the top, I was able to add angular data-tables as intended.