Package path ./styles/ is not exported from package @syncfusion\ej2-angular-grids

[Joachim Heck]

Dear syncfusion team,

we have just updated our app to angular 15 - unfortunately we have some fresh build errors after the update which is related to missing style exports in the package.json of the syncfusion libraries.

We are overwriting some styles and use the defaults as basis:

@use '../vars' as *;
@import "@syncfusion/ej2-angular-grids/styles/fabric.css";
@import "@syncfusion/ej2-base/styles/fabric.css";

this will lead to exceptions with the newest angular build:

HookWebpackError: Module build failed (from ./node_modules/css-loader/dist/cjs.js):
Error: Package path ./styles/fabric.css is not exported from package {PATH}ode_modules\@syncfusion\ej2-angular-grids (see exports field in {PATH}ode_modules\@syncfusion\ej2-angular-grids\package.json)

After lookup there is indeed no "exports" related to styles in the related package.json files.
Is there a reason for this?

[Rajapandi Ravi]

Hi Joachim,

Greetings from Syncfusion support

Based on your query we have prepared a sample of Grid in Angular 15 and tried to reproduce your reported problem at our end, but it was unsuccessful. Please refer the below code example and sample for more information.

Style.css

 

//we have referred the fabric CSS from the nodemodules to the Grid

 

@import '../node_modules/@syncfusion/ej2-base/styles/fabric.css'; 

@import '../node_modules/@syncfusion/ej2-buttons/styles/fabric.css'; 

@import '../node_modules/@syncfusion/ej2-calendars/styles/fabric.css'; 

@import '../node_modules/@syncfusion/ej2-dropdowns/styles/fabric.css'; 

@import '../node_modules/@syncfusion/ej2-inputs/styles/fabric.css'; 

@import '../node_modules/@syncfusion/ej2-navigations/styles/fabric.css';

@import '../node_modules/@syncfusion/ej2-popups/styles/fabric.css';

@import '../node_modules/@syncfusion/ej2-splitbuttons/styles/fabric.css';

@import '../node_modules/@syncfusion/ej2-notifications/styles/fabric.css';

@import '../node_modules/@syncfusion/ej2-angular-grids/styles/fabric.css';

 

 

Sample:

Documentation: https://ej2.syncfusion.com/angular/documentation/grid/getting-started#adding-css-reference

Regards,

Rajapandi R

Attachment: myapp_2829743b.zip

[Murat BESER]

Hi,

I did encounter with same issue I did try "../node_modules" or directly from name space. so I decided to investigate a bit.

so I went into "@syncfusion/ej2-angular-buttons" package directory then checked the package.json​ and at exports there was no styles folder added it as

"./styles/*.css" : "./styles/*.css",

yet I was getting the error TypeError: Cannot read properties of undefined (reading 'type') ​files were there.

So I created an empty css file, and export was working perfectly. copied tailwind-dark.css file and I got the same error as above. removed its contents and tried it importing from again it worked.

After examining the tailwind-dark.css file I realized there were imports for fonts which is causing post css​ to fail. removed them currently everything works fine.

I repeated this action on every file. now everything works fine.

edit: this behavior doesn't happen on base package because there are export entries. 

[Rajapandi Ravi]

Murat,

We are not able to reproduce your reported problem at our end.

However, we are happy to hear that you are resolving the problem at your end.

Please get back to us if you need further assistance.