Hi
I've see a guide on how to create a new application and a new module.
I have a created a new application for our solution.
The entire solution and modules will be based on angular ui.
I want to create a new module with a user interface,
How do I create this module.
Will be a seperate solution?
Is it possible to have the module in the solution as the base application visual studio solution?
I would like to have a single visual studio solution if possible to develop the modules as well as the base application but keep the module code is seperate projects.
How do I include this module in the application?
How do I load the ui for the module in the main application.
12 Answer(s)
-
1
Hi,
Every module can be a separate solution (like we did for the modules) or you can develop it under a single Visual Studio solution (for example, in the microservice demo, we've included a product module into the solution).
I suggest you to go with a single solution at the beginning since it is easier to develop, test, run and maintain. You know, in a single solution, you can cross reference projects. Assuming you will create your module as layered (like this), your application's domain layer should depend on the module's domain layer and so on (as a good practice, but you don't have to do). Also, add standard
DependsOnattribute (see the document) when you add a project reference.You can create a new module (using
abp new MyProductName.MyModuleName -t module-pro- see), then add its projects to the application's solution then add references and dependson attributes. In the future, we will also automate this.For the UI part, you can investigate the Angular UI modules we've created to understand how a module is developed. We are using them as NPM packages in the main application, however it may not be practical in development. @mehmet can write you more about that.
-
0
Hi @bhyatz,
You have two options to create a new module in a single Angular solution. You can create a regular module or create a library.
In short, Angular libraries are modules that can be published easily.
Angular CLI can be used for both options.
See the Angular CLI documentation
You can use the following command in the Angular application root folder to create a new module.
The same way followed in the Angular-MongoDB tutorial.
yarn ng generate module <your-module-name> --route <your-module-name> --module app.moduleIf you use the above command, it will create a lazy-loaded module in the
app/<your-module-name>folder.
You can use the following command to create a library
yarn ng generate library <your-library-name>If you execute the above command, it will create a library in the
projects/<your-library-namefolder. This library can be used in your Angular application. You can import any module, component, directive, etc., from this library.See the Angular libraries guide
Note: If you don't plan to publish any library to an NPM server, making each module a library will complicate your angular application.
If you generate a module with ABP CLI, an Angular application with two libraries will be created. You must publish these Angular libraries to use in your main solution.
If you chose this way, Symlink Manager may help you. Symlink Manager is a JS package that easily manages to symbolic link processes of your dependency packages.
-
0
What is the different between the -t module and -t module-pro, the -t app and -t app-pro. Via the CLI, using -t module-pro creating a new module failed, but use the -t module succeed.
-
0
Hi @trendline
modulecreates a new module with a sample host application uses the free and open source modules and themes.module-prouses the commercial modules and themes. It doesn't have much difference for a module development but we suggest you usemodule proif you then will use this module in an ABP Commercial based solution.We will check the problem for
module pro, thank you for reporting this.appcreates a free startup template based project with free modules and themes included. if you want to use it, no need to pay for the ABP Commercial :)app-procreates a startup project based on the commercial modules and themes. -
0
Via the CLI, using -t module-pro creating a new module failedI tried, and successfully downloaded module-pro and app-pro templates. Please don't only say 'it failed'. Share the error with us.
-
0
Hi@yekalkan,
Thanks for your cliarification, after I changed my network to another one, both module and module-pro template works fine via CLI, but before that module-pro template not work in the network.
BTW, some package references of moudle-pro template is older than the module template.
-
0
I think this post/answer should be tagged in the front page, since it contains some good references on creating a new Angular UI module. It took me lot of time to search and find this post/answer.
-
0
Thanks @vrajasekaran for your suggestion. We will create a module development tutorial soon, that will be much better.
-
0
Hi,
I have use abp new DemoMod -t module-pro command to create module. But it is shown in ABP Suite as Angular Module.
How to make the module to Mvc instead of Angular?
Thank you.
-
0
hi @Leaf,
UI Framework is not meaningful for modules because a module solution has both Angular and MVC. So you can ignore the UI Framework : Angular. Probably this text will be removed in the next versions for modules.
-
0
Hi @alper,
Thanks for reply.
I manage to generate the module via ABP suite and manage to add-migration into database.
How to add the module's page in main Menus and permission page ?
Thanks @alper.
-
0
Suite adds it to main menu automatically. you don't need to manually add. just add-migration and update database, you'll see it in the menu. forexample, if your module project name is Acme.MyStore then there'll be a main menu item called "My Store", all the menu items are added under "My Store" parent menu.
