Error More than one module matches Use skip-import option to skip importing the component into the closest module

Question

When I try to create a component in the angular cli  it s showing me this error  How do I get rid of it       Error  More than one module matches  Use skip-import option to skip importing the component into the closest module    I m using angular cli version  1 4 1

User · Answer

if you are creating in specific module go to that path and run ng g c componentname

else create module first ng g module modulename

cd arc/app/modulename go to modulename path and create the component

User · Answer

When app or lib have multiple nested modules   myApp    gt  src      gt  app       app module ts        gt  routes          gt  login            gt  auth           login module ts      Angular CLI   ng g component routes login auth my-auth --module routes login login module ts       NRWL NX Angular CLI   ng g component routes login auth my-auth --project myApp --module routes login login module ts      Result   myApp    gt  src      gt  app       app module ts        gt  routes          gt  login            gt  auth              gt  my-auth               my-auth component ts etc              login module ts

User · Answer

There are two ways to solve this issue   1  Skip  using --skip-import in command  default import and create component and once component is created import it manually wherever you want to use it   ng generate component my-component --skip-import   2  Provide module name explicitly where you want it to be imported  ng generate  component  my-component --module my-module module

User · Answer

Angular CLI  8 3 1   when you have multiple module ts files inside a module  you need to specify for which module file you are generating component   ng g c modulefolder componentname --module modulename module   for e g  i have shared module folder inside which i have shared module ts and material module ts like this  shared    gt  shared module ts    gt  material module ts   and i want to generate sidebar component for shared module ts then i will run following command  ng g c shared sidebar --module shared module   if you want to export the component then run following command  ng g c shared sidebar --module shared module --export

User · Answer

My project was created using Visual Studio Community 2017 and it creates 3 separated modules  app browser module  app server module and app shared module  In order to create my components I checked above answers and found my module to be app shared module   So  I run   ng g c componentName --module app shared module

User · Answer

Try This  It is working for me  ng generate component componentName --module app module

User · Answer

I had this warning when had this in angular json config    prefix    app ng    When changed to  app  all worked perfectly fine

User · Answer

You have to give the specify module name like  ng g c your-component --module module-name   Where module-name should be that you want to update with newly created component

User · Answer

When there is more than one module under app folder  generating a component with below command will fail   ng generate component New-Component-Name   The reason is angular CLI detects multiple module  and does t know in which module to add the component  So  you need to explicitly mention which module component will be added   ng generate component New-Component-Name --module ModuleName

User · Answer

It is working for me  ng g component component-name --skip-import

User · Answer

Just to add another piece of info to this for anyone like me who happens along that just has a single application     I had my application set up with the main app module ts and I had routing with the routing module in it s own folder under the main application   I went through and did some  cleaning up  since I had a few other things that needed to be organized better   One thing I did was move the routing module ts to the root folder  since it was the only file in the folder I figured it didn t need it s own folder   This worked fine at first but next time I tried to generate a new component  some time later  through the WebStorm IDE  it failed with this message   After reading through this I tried putting the routing module back into a separate folder and it worked again   So note of warning to others  don t move the routing module into your root folder   I m sure there are other ways to deal with this too but I m happy with it in it s own folder for now and using the IDE generator like I was previously

User · Answer

Just a small update to Zisha s answer    In my project all the modules were placed in a folder called  modules  and all the components are placed in  components  folder under  src app     so to create a component under a specific path  I used the following syntax        ng g c components path component name --module modules path module name   example        ng g c components login --module modules app

User · Answer

Angular CLI  8 3 4 Node   10 16 3 Angualr   4 2 5  I used  dotnet new angular  command to generate the project  and it has generated 3 different modules in app folder  Although a simple test with ng new project-name just generates a single module    see the modules in your project and decide wich module you want - then specify the name  ng g c componentName --module  name-of-your-module    You can read more about modules here  https   angular io guide architecture-modules

User · Answer

Specify the module using the --module parameter   For example  if the main module is app module ts  run this   ng g c new-component --module app   Or if you are in an other directory then  ng g c component-name --module

User · Answer

As a hack  below steps  worked for me   1  Move   module ts files from src app to a location out of the project   2  Execute command to create component  ng g c component-name   3  Move back the   module ts files to src app

User · Answer

when you have more than one module  you need to specify module name    ng g c componentName --module modulename module

User · Answer

This is caused since the generation tried to add your component to a module  i e  to add this line  import   MyComponent   from    Components my-component my-component component     but it found 2 modules   As stated here  they fixed it to a situation where as long as in the root src app folder you have only 1 module  you re fine  so just move the secondaries modules to a sub-folder   Otherwise you have to use --module

User · Answer

I was getting below error when trying to create a new component under a folder   error  More than one module matches  Use skip-import option to skip importing the component into the closest module   I have used below command and new component got created successfully under a folder    ng g c folderName my newComponent ---module    app

User · Answer

try ng g component header --module app it is work for me

User · Answer

Angular CLI  6 0 8 Node  10 4 0 OS  linux x64 Angular  6 0 4  In case there is a feature module  e g  manager module ts inside the e g    manager  sub-folder  with the routing module externalized into the separate NgModule  e g  manager-routing module ts  the error message   More than one module matches  Use skip-import option to skip importing the component into the closest module   does not appear and the component is properly generated and added to the manager module ts module   BUT BE CAREFUL the naming convention  the name of the routing module must terminate with  -routing    If the routing module is given a name like e g  manager-router module ts  CLI will complain with the error message and expect you to provide --module option to automatically add the component import   ng generate component some-name --module manager module ts   or  ng generate component some-name --skip-import   if you prefer to add the import of the component manually

User · Answer

In my case  it seems ng is not registered into my environment path  I have been using npm run command to run the ng commands  Be aware in order to pass arguments you need an extra -- as per the npm run specification  Example  npm run ng g c components scheduling   --   --module app  Or  npm run ng g c components scheduling   --   --skip-import

[angular] Error: More than one module matches. Use skip-import option to skip importing the component into the closest module

Examples related to angular