Suitecrm8 npm run start or ng serve

[lukio]

Hello everyone!

Does anybody try to run angular front-end as any developer angular project?

For example running npm run start or ng serve ? as the setup guide of angular recommends?

Thanks!

[pgr]

Hi.

I only run through Apache after rebuilding the front-end with yarn build

I don’t really know Angular that well…

Have you checked the yarn scripts defined in package.json? Maybe you can use one of those for your purposes?..

[anthony.oak.castro]

Hey @lukio,

From what I know:

1. The setup requires you to use yarn. Its a requirement from the angular-module-federation version that SuiteCRM is using. but the yarn commands are calling ng, have a look at package.json

2. ng serve does not work due to the setup. However can use --watch on the build.

[pgr]

@anthony.oak.castro can you please provide more detail on that --watch thing? Which command do you use, exactly, and what happens when you use it?

Thanks

[lukio]

Hi @anthony.oak.castro, I found that you reply about this stuff, but only set --watch to the extensions folder.

How can I have my local development compile?

Hey @Deal, Are you doing your changes within the extensions/defaultExt folder? The yarn run build-dev:defaultExt --watch will only watch the extensions/defaultExt folder (see the angular.json config). The footer.component.html is a core file, you need to do watch on the core and shell. Just a warning: the changes done to core folder are not upgrade safe. Its not recommended. All files there will be replaced whenever you upgrade. You can track the changes by using git or similar, but is goin…

If we would like to set up --watch to all the angular app, which will be the command to run?

thanks!

[lukio]

What I mean, is… how the core developers work with the angular project? I’m sure that they do not recompile everytime that they do some changes to the core app.

[anthony.oak.castro]

Hey @pgr @lukio , its all on the docs,

WARNING: Just before we continue, unless you really need it you should really avoid changing stuff on core… not a good idea… try the frontend extensions first…

1. core build docs

On docs you have the commands to rebuild the app:

yarn run build:common
yarn run build:core
yarn run build:shell

Front-end Developer Install Guide

2. extension build docs

Then on the extensions build docs you it says that you can do:

yarn run build-dev:<your-extension-name> --watch

Setting Up a Front-End Extension Module

3. Running core build with watch

Since --watch is native to angular, you can just do:

Note: most of the code is on core so you most likely don’t need to rebuild the common.

yarn run build:core --watch

and when that finishes, on a separate terminal tab, you can run:

yarn run build:shell --watch

[lukio]

Hello @anthony.oak.castro, how are you.

I could set up my instance of suitecrm with docker running --watch to defaultExt extensions. I tried to follow the documentation to add a new sidebar-widget but it throw me the error Widget not found.

I know that the files at extensions are being read, because the watcher reload when I changes those files. When I added the new widget to a detailview, it seems that the suitecrm can’t found it.

I followed up the Hello World example

any ideas?

[anthony.oak.castro]

Hey @lukio, did you call repair and rebuild or cleared cache after adding to the detail view? and did you enable the extension on extensions/defaultExt/config/extension.php (that also needs a clear cache, by the way)