ng add schematics not working

[aboudard]

It looks like schematics are not working.

Minimal reproduction of the bug with instructions:

Windows
Angular CLI 9.0.4

Expected behavior:

Install ngx spinner

Result:

An unhandled exception occurred: Collection "ngx-spinner" cannot be resolved.

I would be willing to submit a PR to fix this issue:

[x ] Yes
[ ] No

Here is what I was working on for a project when adding useful libraries :

export function spinner(_options: any): Rule {
  return (tree: Tree, _context: SchematicContext) => {
    return chain([
      updateDependencies(),
      addModule(_options.project),
    ])(tree, _context);
  };
}

function updateDependencies(): Rule {
  return (tree: Tree, context: SchematicContext) => {
    context.logger.debug("Updating dependencies...");
    context.addTask(new NodePackageInstallTask());

    addPackageJsonDependency(tree, {
      type: NodeDependencyType.Default,
      name: 'ngx-spinner',
      version: ngxSpinnerVersion,
    });

    return tree;
  }
}


function addModule(projectName?: string): Rule {
  return (tree: Tree) => {
    const workspace = getWorkspace(tree);
    const project = workspace.projects[projectName || workspace.defaultProject!];
    const buildOptions = getProjectTargetOptions(project, 'build');
    const modulePath = getAppModulePath(tree, buildOptions.main);
    const moduleSource = getSourceFile(tree, modulePath);
    const changes = addImportToModule(
      moduleSource,
      modulePath,
      'NgxSpinnerModule',
      'ngx-spinner'
    );
    const recorder = tree.beginUpdate(modulePath);
    changes.forEach((change) => {
      if (change instanceof InsertChange) {
        recorder.insertLeft(change.pos, change.toAdd);
      }
    });
    tree.commitUpdate(recorder);

    return tree;
  }
}

This is part of a bigger ng-add schematics, and of course we call install at the end :

export function installDependencies(): Rule {
  return (tree: Tree, context: SchematicContext) => {
    context.addTask(new NodePackageInstallTask());
    context.logger.debug("✅️ Dependencies installed");
    return tree;
  };
}

[Napster2210]

@aboudard Thanx a lot for the detailed issues. I'll make required changes and release a new version soon.

[Napster2210]

Latest version v10.0.0 is released!!!!!
https://github.com/Napster2210/ngx-spinner/releases/tag/v10.0.0

[aboudard]

Great news :)
I'll give a try and integrate it in my external schematics !

[Napster2210]

@aboudard Let me know if you've any suggestion regarding schematics once you're installed the latest version.

[aboudard]

Hello,
I have an error when installing on a brand new empty Angular 10 project.

• ng new myProject
• cd myProject
• ng add ngx-spinner
  Installing packages for tooling via npm.
  Installed packages for tooling via npm.
  √ Packages installed successfully.
  Cannot find module '@angular/cdk/schematics'

I myself only use the utils from @schematics/angular/utility, but I see in the source that you use cdk, I think you don't need that.

[rspl-yuvraj]

@aboudard Thanx for pointing out, I'll make necessary changes and release the new one.

[aboudard]

If I can help on this particular issue, just tell me, I'd gladly submit PR on this, but it's no emergency I guess, the spinner is working just fine in Angular 10 from what I tested :)
It's summer time, so I might not be as active for the next few weeks though !

[Napster2210]

@aboudard I'll make necessary changes in next release, enjoy your summer time!!!

[aboudard]

Hello @Napster2210 , would you like me to try and come with a working schematics ?

[Hamnava]

Hello, I am using Angular 12.2.16 and when I try the command ng add ngx-spinner it gives me this error :Collection : node_modules\\ngx-spinner\\schematics\\collection.json" cannot be resolved.

[aboudard]

Hello @Hamnava, indeed, the schematics are not functional.
I proposed help but doesn't seem to work.
Check my initial post up here if you want details.

[chandimaezone]

The issue persists with Angular 16 as well. Any solution for this?

[aboudard]

I'm sorry to hear that, ngx-spinner is a great library.
If the author won't fix, maybe I could propose a one.
I'll check that.

[Napster2210]

Hello All, I will start working on this during weekend. Sorry for the delay as I was not able to check this package from long time due to some issues.

[aboudard]

I hope everything is alright, feel free to ask for review or testing :)

[chandimaezone]

@Napster2210 Thanks mate. Let us know any help needed. I will also be available for sometime during the weekend.