ludohenin / gulp-inline-ng2-styles

Gulp plugin to inline style sheets into Angular 2 component views
MIT License
1 stars 0 forks source link

Plugin not finding relative components. #2

Open jrgleason opened 8 years ago

jrgleason commented 8 years ago

The following is the header of my NG2 class

import {Component} from '@angular/core';
import { ApplicationConstants } from '../../constants/ApplicationConstants';
import { Hero } from './hero'
import { HeroDetailComponent } from './detail/hero-detail.component';
import { HeroService } from './hero.service';
import { OnInit } from '@angular/core';
import {MdIconRegistry} from "@angular2-material/icon/icon-registry";
import {MD_CARD_DIRECTIVES} from "@angular2-material/card/card";
import {MD_BUTTON_DIRECTIVES} from "@angular2-material/button/button";
import {MD_ICON_DIRECTIVES} from "@angular2-material/icon/icon";
import {MD_LIST_DIRECTIVES} from "@angular2-material/list/list";
import {MD_INPUT_DIRECTIVES} from "@angular2-material/input/input";
import {MdToolbar} from "@angular2-material/toolbar/toolbar";
@Component({
    selector: 'hero',
    templateUrl: 'hero.component.html',
    styleUrls: [ 'components/hero/hero.component.css' ],
    directives: [HeroDetailComponent, MD_CARD_DIRECTIVES, MD_BUTTON_DIRECTIVES, MD_LIST_DIRECTIVES, MD_ICON_DIRECTIVES, MdToolbar, MD_INPUT_DIRECTIVES],
    providers: [HeroService],
    viewProviders: [MdIconRegistry]
})

then the plugin is configured....

gulp.task('js:build', function () {
  var tsProject = ts.createProject('tsconfig.json');
  return tsProject.src() // also can use *.js files
    .pipe(embedTemplates({sourceType: 'ts'}))
    .pipe(inlineNg2Styles({base: '/src/ng2'}))
    .pipe(sourcemaps.init())
    .pipe(ts(tsProject))
    .pipe(sourcemaps.write())
    .pipe(gulp.dest("public/ng2"));
});

When I try to run the inline styling I get...

ReferenceError: HeroDetailComponent is not defined at eval (eval at replace (C:\Users\jgleason\dev\code\ng2-demo-app\node_modules\gulp-inline-ng2-styles\index.js:86:36), :25:18) at replace (C:\Users\jgleason\dev\code\ng2-demo-app\node_modules\gulp-inline-ng2-styles\index.js:86:14) at C:\Users\jgleason\dev\code\ng2-demo-app\node_modules\gulp-inline-ng2-styles\index.js:74:44

The project I am trying to integrate with is https://github.com/jrgleason/ng2-demo-app

jrgleason commented 8 years ago

P.S. Everything works fine without the plugin.