CODEWITHSUNDEEP
angularangular-schematics
MarkD
MarkD

Reputation: 4954

Custom Angular Schematic: Pipe "dasherize" is not defined. when run on angular project

I created a simple new schematic using the angular schematics cli. This schematic takes as input a name, and generates a file in the tree. My files/ directory looks like:

src/
  app/
    __name@dasherize__.ts

I've built it, and then created a new angular project:

ng new test-app --routing --style css

I then cd into the test-app directory and link to my sample schematic:

npm link ../schematics/sample-schematic

I then run my schematic:

ng g sample-schematic:sample

however I get the following error when I do so:

Pipe "dasherize" is not defined.

If I change the file name in my files directory to test.ts it works fine, and the file is created. I am guessing i am missing some import to use the various schematic functions in my test-app project. My dependancies and dev-dependancies for test-app looks like:

  "dependencies": {
    "@angular/animations": "~7.2.0",
    "@angular/common": "~7.2.0",
    "@angular/compiler": "~7.2.0",
    "@angular/core": "~7.2.0",
    ...
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.13.0",
    "@angular-devkit/core": "^7.3.9",
    "@angular-devkit/schematics": "^7.3.9",
    "@angular-devkit/schematics-cli": "^0.13.9",
    "@angular/cli": "~7.3.9",
    "@angular/compiler-cli": "~7.2.0",
    "@angular/language-service": "~7.2.0",
    "@schematics/angular": "^7.3.9",
    ...
  }

Upvotes: 3

Views: 1521

Answers (2)

Thierry Falvo
Thierry Falvo

Reputation: 6300

Please check this. It might probably help you.

Be sure to import strings

import { strings } from '@angular-devkit/core';

and then, pass strings to template engine, as below :

const sourceParametrizedTemplates = apply(sourceTemplates, [
  template({
    ...options,
    ...strings,
  })
]);

No need to assign functions to options. (and it all the case, it won't be good practice to change options variable).

With this, dasherize function will be available inside name and also template code.

Hope it will help you.

Upvotes: 9

MarkD
MarkD

Reputation: 4954

I found a workaround, but it isn't really satisfying. If anyone has a better solution, I am all ears.

What I ended up doing- in the function where I set up my options/workspace, etc.. I added some code:

options.dashName = dasherize(options.name);
options.theName = camelize(options.name);
options.Name = classify(options.name);

Then in my templates I can access dashName, theName, and Name for dashed, camelCase, and PascalCase respectively. Still not sure why the pipes aren't working in file names (or in the templates themselves), but this does get things working for now.

Upvotes: 1

Related Questions