Dspace 7.6 Angular installation

[stb...@gmail.com]

Dear all,

after building yarn build:prod I have got the error message:

./node_modules/@ng-dynamic-forms/ui-ng-bootstrap/fesm2020/ui-ng-bootstrap.mjs:736:285-301 - Error: export 'MaskDirective' (imported as 'i4') was not found in 'ngx-mask' (possible exports: INITIAL_CONFIG, NEW_CONFIG, NGX_MASK_CONFIG, NgxMaskDirective, NgxMaskModule, NgxMaskPipe, NgxMaskService, _configFactory, initialConfig, timeMasks, withoutValidation)

What should I do now?

Thanking you in advance

Stefanie

[DSpace Technical Support]

That sounds like an error because something didn't install properly.  I'd recommend re-running the "yarn install" by doing this:

# Clean current cached data

yarn clean

# Reinstall all dependencies

yarn install

# Try to build again

yarn build:prod

Hopefully it will succeed this time, as it sounds like it's complaining that a dependency wasn't fully installed in that "yarn install" step.

Tim

[Abdelouahab Djoudi]

i have the same issue 

[David Tolmie]

Did the folks who ran into this error ever figure out how to resolve it? I too am running into the error, even after Tim's troubleshooting steps.

Thanks,

-Dave

[DSpace Technical Support]

For folks who are hitting this strange error ("export 'MaskDirective' (imported as 'i4') was not found in 'ngx-mask'"), could you share what version of Node you are using?  And what operating system?

While searching around, I came across a similar error on StackOverflow (not specific to DSpace).  In this scenario, the person said it only occurs with Node v18, while Node v16 works fine: https://stackoverflow.com/questions/78236715/how-to-solve-error-export-maskdirective-imported-as-i8-was-not-found-in-n

I'm not able to reproduce this error on Windows 11 using Node v18.20.2 & it's not occurred in our automatic build testing on Ubuntu (also using Node 18).  But, it sounds like several of you are hitting this error.  So, maybe it's somehow specific to a version of Node?  Or specific to an Operating System?

Overall, this error is referencing *dependencies* of DSpace (@ng-dynamic-forms and ngx-mask), and not DSpace itself.  This is why I'm starting to wonder if there are specific build environments where these dependencies are not working properly.

If anyone has found a solution, hopefully they will share it so that we can document it.

Tim

[Michael Plate]

Hi,

Am 07.05.24 um 19:51 schrieb David Tolmie:

> Did the folks who ran into this error ever figure out how to resolve it?
> I too am running into the error, even after Tim's troubleshooting steps.

[…]

I'm not sure if I had the same error a while ago…
what version of node and yarn do you have ?
Mine is

yarn -v
1.22.19

node -v
v18.19.0



CU

Michael

[Joachim Schneider]

I am on a fresh install of Ubuntu 22.04.4 LTS with NodeJS v18.20.4 and Yarn 1.22.22

$ cd /opt/dspace-frontend

$ yarn clean

$ yarn install

[many warnings]

$ yarn build:prod

yarn run v1.22.22
$ cross-env NODE_ENV=production yarn run build:ssr
$ ng build --configuration production && ng run dspace-angular:server:production
⠙ Generating browser application bundles (phase: setup)...- angular-idle-preload [main/commonjs] (git+https://github.com/gdi2290/angular-idle-preload.git)
- ngx-sortablejs [es2015/esm2015] (https://github.com/sortablejs/ngx-sortablejs)
- ng2-file-upload [es2015/esm2015] ()

✔ Browser application bundle generation complete.

[fewer warnings]

./node_modules/@ng-dynamic-forms/ui-ng-bootstrap/fesm2020/ui-ng-bootstrap.mjs:736:285-301 - Error: export 'MaskDirective' (imported as 'i4') was not found in 'ngx-mask' (possible exports: INITIAL_CONFIG, NEW_CONFIG, NGX_MASK_CONFIG, NgxMaskDirective, NgxMaskModule, NgxMaskPipe, NgxMaskService, _configFactory, initialConfig, timeMasks, withoutValidation)

error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.

HTH. If I can help any more with logs or anything, just give me a hint :)

[DSpace Technical Support]

All,

I encountered this same error today in a Pull Request:

./node_modules/@ng-dynamic-forms/ui-ng-bootstrap/fesm2020/ui-ng-bootstrap.mjs:729:307-323 - Error: export 'MaskDirective' (imported as 'i4') was not found in 'ngx-mask' (possible exports: INITIAL_CONFIG, NEW_CONFIG, NGX_MASK_CONFIG, NgxMaskDirective, NgxMaskModule, NgxMaskPipe, NgxMaskService, _configFactory, initialConfig, timeMasks, withoutValidation)

That said, the error ONLY seems to occur when an **incompatible** version of "ngx-mask" is installed.  

In my case, I saw the error when building this PR: https://github.com/DSpace/dspace-angular/pull/3433   This PR simply updated "ngx-mask" from version 14.2.4 to 14.3.3.  But, that error occurs because in "ngx-mask" version 14.3.2 the "MaskDirective" class was renamed to "NgxMaskMaskDirective".  See the "ngx-mask" changelog at https://github.com/JsDaddy/ngx-mask/blob/develop/CHANGELOG.md#feature-1432 

However, that doesn't explain why some people are encountering this issue in a "fresh install".   The only way I see it is if the wrong version of "ngx-mask" is installed, but in DSpace 7.6.2 and 8.0, we **pin** "ngx-mask" to a compatible version.

So, I'm still stumped as to the reason why some people see this error.  But, I've at least figured out a different scenario where it also occurs.

Tim

[msp...@willamette.edu]

In case it's helpful....I also just ran into this issue on a fresh 7.6.2 install. In yarn.lock, I see that the ngx-mask package resolved to version 13.2.2. So I edited package.json to just install bug fix releases using "ngx-mask@~13.1.7" and my build succeeded. 

[DSpace Technical Support]

Hi Michael,

That's very odd behavior, because in the "yarn.lock" for DSpace 7.6.2, it looks like it's using "ngx-mask" version 13.1.15.    

Here's the "yarn.lock" which comes with DSpace 7.6.2:

https://github.com/DSpace/dspace-angular/blob/dspace-7.6.2/yarn.lock#L8459-L8464

Where did you see DSpace using "ngx-mask" version 13.2.2?   That definitely is *wrong*, but I'm confused where that could be coming from.  If we can figure out where it comes from, then that may help us track down why some people are hitting this error when installing DSpace 7.6.2.

Thanks,

Tim

[msp...@willamette.edu]

Hi Tim,

I don't recall the details exactly, but I bumped into an installation error when running yarn install. The message said that package.json defined a packageManager field, that it was set to yarn 4.10 and that I needed to enable Nodejs CorePack. I wasn't sure about enabling corepack, so I added a packageManager field to the 7.6.2 package.json file, setting it to use yarn 1.22.22. 

After that confusion, I might have run yarn upgrade.  If so, that was probably my mistake. It would explain how ngx-mask was bumped up to 13.2.2.

[msp...@willamette.edu]

I reproduced my previous installation process. I must have ran "yarn upgrade" since that's the only way I can recreate this error. 

There were a few odd things during the installation that I might also mention. I saw an initial error generated by node-gyp/lib/configure.js caused by a newer version of python on my machine and missing a library (see this issue). I was able to fix this. The error message was followed by a warning to upgrade yarn to 1.22.22 from 1.22.19 so I did that as well.  But after upgrading yarn I saw the error mentioned in my previous note: 

error This project's package.json defines "packageManager": "yarn 4.1.0". However the current global version of Yarn is 1.22.22.

Yarn refuses to run until I add a packageManager element to "package.json" or enable CorePack. I've seen discussion of this type of problem elsewhere but I'm not sure why it is triggered in my case. And I see in this thread that others seem to be using yarn 1.22.22 without a problem. So it's a confusing. I'm using macOS and nodejs 18. 

Sorry to add this to the current discussion but I'm not sure it merits a separate thread.

[msp...@willamette.edu]

In case someone else bumps into a problem with yarn and CorePack, reverting back to yarn 1.22.19 fixed my issue. I don't have an explanation, but it looks like there may be a gotcha in later yarn 1.x releases.