diff --git a/packages/@angular/cli/blueprints/component/index.ts b/packages/@angular/cli/blueprints/component/index.ts index e618d41470bc..0d46d747b1be 100644 --- a/packages/@angular/cli/blueprints/component/index.ts +++ b/packages/@angular/cli/blueprints/component/index.ts @@ -238,9 +238,11 @@ export default Blueprint.extend({ const returns: Array = []; const className = stringUtils.classify(`${options.entity.name}Component`); const fileName = stringUtils.dasherize(`${options.entity.name}.component`); - const componentDir = path.relative(path.dirname(this.pathToModule), this.generatePath); - const normalizeRelativeDir = componentDir.startsWith('.') ? componentDir : `./${componentDir}`; - const importPath = componentDir ? `${normalizeRelativeDir}/${fileName}` : `./${fileName}`; + const fullGeneratePath = path.join(this.project.root, this.generatePath); + const moduleDir = path.parse(this.pathToModule).dir; + const relativeDir = path.relative(moduleDir, fullGeneratePath); + const normalizeRelativeDir = relativeDir.startsWith('.') ? relativeDir : `./${relativeDir}`; + const importPath = relativeDir ? `${normalizeRelativeDir}/${fileName}` : `./${fileName}`; if (!options.skipImport) { if (options.dryRun) { diff --git a/tests/e2e/tests/generate/component/component-module.ts b/tests/e2e/tests/generate/component/component-module.ts index 4cbda4b5d07e..92064359d785 100644 --- a/tests/e2e/tests/generate/component/component-module.ts +++ b/tests/e2e/tests/generate/component/component-module.ts @@ -1,15 +1,29 @@ +import * as fs from 'fs-extra'; import {join} from 'path'; import {ng} from '../../../utils/process'; import {expectFileToMatch} from '../../../utils/fs'; export default function() { - const modulePath = join('src', 'app', 'app.module.ts'); + const root = process.cwd(); + const modulePath = join(root, 'src', 'app', 'app.module.ts'); + + fs.mkdirSync('./src/app/sub-dir'); return ng('generate', 'component', 'test-component', '--module', 'app.module.ts') .then(() => expectFileToMatch(modulePath, /import { TestComponentComponent } from '.\/test-component\/test-component.component'/)) + .then(() => process.chdir(join(root, 'src', 'app'))) + .then(() => ng('generate', 'component', 'test-component2', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestComponent2Component } from '.\/test-component2\/test-component2.component'/)) + + .then(() => process.chdir(join(root, 'src', 'app', 'sub-dir'))) + .then(() => ng('generate', 'component', 'test-component3', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestComponent3Component } from '.\/test-component3\/test-component3.component'/)) + // Try to run the unit tests. .then(() => ng('build')); } diff --git a/tests/e2e/tests/generate/directive/directive-module.ts b/tests/e2e/tests/generate/directive/directive-module.ts index c95637762896..62ad00f373ef 100644 --- a/tests/e2e/tests/generate/directive/directive-module.ts +++ b/tests/e2e/tests/generate/directive/directive-module.ts @@ -1,15 +1,29 @@ +import * as fs from 'fs-extra'; import {join} from 'path'; import {ng} from '../../../utils/process'; import {expectFileToMatch} from '../../../utils/fs'; export default function() { - const modulePath = join('src', 'app', 'app.module.ts'); + const root = process.cwd(); + const modulePath = join(root, 'src', 'app', 'app.module.ts'); + + fs.mkdirSync('./src/app/sub-dir'); return ng('generate', 'directive', 'test-directive', '--module', 'app.module.ts') .then(() => expectFileToMatch(modulePath, /import { TestDirectiveDirective } from '.\/test-directive.directive'/)) + .then(() => process.chdir(join(root, 'src', 'app'))) + .then(() => ng('generate', 'directive', 'test-directive2', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestDirective2Directive } from '.\/test-directive2.directive'/)) + + .then(() => process.chdir(join(root, 'src', 'app', 'sub-dir'))) + .then(() => ng('generate', 'directive', 'test-directive3', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestDirective3Directive } from '.\/test-directive3.directive'/)) + // Try to run the unit tests. .then(() => ng('build')); } diff --git a/tests/e2e/tests/generate/guard/guard-module.ts b/tests/e2e/tests/generate/guard/guard-module.ts index 7ead4bdd903d..d1f96d247255 100644 --- a/tests/e2e/tests/generate/guard/guard-module.ts +++ b/tests/e2e/tests/generate/guard/guard-module.ts @@ -1,15 +1,30 @@ +import * as fs from 'fs-extra'; import {join} from 'path'; import {ng} from '../../../utils/process'; import {expectFileToMatch} from '../../../utils/fs'; export default function() { - const modulePath = join('src', 'app', 'app.module.ts'); + const root = process.cwd(); + const modulePath = join(root, 'src', 'app', 'app.module.ts'); + + fs.mkdirSync('./src/app/sub-dir'); return ng('generate', 'guard', 'test-guard', '--module', 'app.module.ts') .then(() => expectFileToMatch(modulePath, /import { TestGuardGuard } from '.\/test-guard.guard'/)) .then(() => expectFileToMatch(modulePath, /providers:\s*\[TestGuardGuard\]/m)) + + .then(() => process.chdir(join(root, 'src', 'app'))) + .then(() => ng('generate', 'guard', 'test-guard2', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestGuard2Guard } from '.\/test-guard2.guard'/)) + + .then(() => process.chdir(join(root, 'src', 'app', 'sub-dir'))) + .then(() => ng('generate', 'guard', 'test-guard3', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestGuard3Guard } from '.\/test-guard3.guard'/)) + .then(() => ng('build')); } diff --git a/tests/e2e/tests/generate/module/module-import.ts b/tests/e2e/tests/generate/module/module-import.ts index 2f2f2104fe9c..f103d1e0be0a 100644 --- a/tests/e2e/tests/generate/module/module-import.ts +++ b/tests/e2e/tests/generate/module/module-import.ts @@ -1,12 +1,16 @@ +import * as fs from 'fs-extra'; import { join } from 'path'; import { ng } from '../../../utils/process'; import { expectFileToMatch } from '../../../utils/fs'; export default function () { - const modulePath = join('src', 'app', 'app.module.ts'); + const root = process.cwd(); + const modulePath = join(root, 'src', 'app', 'app.module.ts'); const subModulePath = join('src', 'app', 'sub', 'sub.module.ts'); const deepSubModulePath = join('src', 'app', 'sub', 'deep', 'deep.module.ts'); + fs.mkdirSync('./src/app/sub-dir'); + return Promise.resolve() .then(() => ng('generate', 'module', 'sub')) .then(() => ng('generate', 'module', 'sub/deep')) @@ -40,4 +44,16 @@ export default function () { .then(() => expectFileToMatch(deepSubModulePath, /import { Test6Module } from '.\/..\/..\/test6\/test6.module'/)) .then(() => expectFileToMatch(deepSubModulePath, /imports: \[(.|\s)*Test6Module(.|\s)*\]/m))); + + .then(() => process.chdir(join(root, 'src', 'app'))) + .then(() => ng('generate', 'module', 'test7', '--module', 'app.module.ts'))) + .then(() => expectFileToMatch(modulePath, + /import { Test7Module } from '.\/test7\/test7.module'/)) + .then(() => expectFileToMatch(modulePath, /imports: \[(.|\s)*Test7Module(.|\s)*\]/m)) + + .then(() => process.chdir(join(root, 'src', 'app', 'sub-dir'))) + .then(() => ng('generate', 'module', 'test8', '--module', 'app.module.ts'))) + .then(() => expectFileToMatch(modulePath, + /import { Test8Module } from '.\/test8\/test8.module'/)) + .then(() => expectFileToMatch(modulePath, /imports: \[(.|\s)*Test8Module(.|\s)*\]/m)) } diff --git a/tests/e2e/tests/generate/pipe/pipe-module.ts b/tests/e2e/tests/generate/pipe/pipe-module.ts index 65d938e0223a..ecfed407ad8a 100644 --- a/tests/e2e/tests/generate/pipe/pipe-module.ts +++ b/tests/e2e/tests/generate/pipe/pipe-module.ts @@ -1,15 +1,29 @@ +import * as fs from 'fs-extra'; import {join} from 'path'; import {ng} from '../../../utils/process'; import {expectFileToMatch} from '../../../utils/fs'; export default function() { - const modulePath = join('src', 'app', 'app.module.ts'); + const root = process.cwd(); + const modulePath = join(root, 'src', 'app', 'app.module.ts'); + + fs.mkdirSync('./src/app/sub-dir'); return ng('generate', 'pipe', 'test-pipe', '--module', 'app.module.ts') .then(() => expectFileToMatch(modulePath, /import { TestPipePipe } from '.\/test-pipe.pipe'/)) + .then(() => process.chdir(join(root, 'src', 'app'))) + .then(() => ng('generate', 'pipe', 'test-pipe2', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestPipe2Pipe } from '.\/test-pipe2.pipe'/)) + + .then(() => process.chdir(join(root, 'src', 'app', 'sub-dir'))) + .then(() => ng('generate', 'pipe', 'test-pipe3', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestPipe3Pipe } from '.\/test-pipe3.pipe'/)) + // Try to run the unit tests. .then(() => ng('build')); } diff --git a/tests/e2e/tests/generate/service/service-module.ts b/tests/e2e/tests/generate/service/service-module.ts index e13ea17f04e1..cc13e337ed23 100644 --- a/tests/e2e/tests/generate/service/service-module.ts +++ b/tests/e2e/tests/generate/service/service-module.ts @@ -1,15 +1,29 @@ +import * as fs from 'fs-extra'; import {join} from 'path'; import {ng} from '../../../utils/process'; import {expectFileToMatch} from '../../../utils/fs'; export default function() { - const modulePath = join('src', 'app', 'app.module.ts'); + const root = process.cwd(); + const modulePath = join(root, 'src', 'app', 'app.module.ts'); + + fs.mkdirSync('./src/app/sub-dir'); return ng('generate', 'service', 'test-service', '--module', 'app.module.ts') .then(() => expectFileToMatch(modulePath, /import { TestServiceService } from '.\/test-service.service'/)) + .then(() => process.chdir(join(root, 'src', 'app'))) + .then(() => ng('generate', 'service', 'test-service2', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestService2Service } from '.\/test-service2.service'/)) + + .then(() => process.chdir(join(root, 'src', 'app', 'sub-dir'))) + .then(() => ng('generate', 'service', 'test-service3', '--module', 'app.module.ts')) + .then(() => expectFileToMatch(modulePath, + /import { TestService3Service } from '.\/test-service3.service'/)) + // Try to run the unit tests. .then(() => ng('build')); }