diff --git a/packages/schematics/angular/application/index_spec.ts b/packages/schematics/angular/application/index_spec.ts index 173a4a0bde56..215664398b8e 100644 --- a/packages/schematics/angular/application/index_spec.ts +++ b/packages/schematics/angular/application/index_spec.ts @@ -868,7 +868,7 @@ describe('Application Schematic', () => { expect(packageJson.devDependencies['@tailwindcss/postcss']).toBeDefined(); const stylesContent = tree.readContent('/projects/foo/src/styles.css'); - expect(stylesContent).toContain('@import "tailwindcss";'); + expect(stylesContent).toContain(`@import 'tailwindcss';`); }); describe(`fileNameStyleGuide: '2016'`, () => { diff --git a/packages/schematics/angular/ng-new/index_spec.ts b/packages/schematics/angular/ng-new/index_spec.ts index 28e1c13f315b..ad97df398fba 100644 --- a/packages/schematics/angular/ng-new/index_spec.ts +++ b/packages/schematics/angular/ng-new/index_spec.ts @@ -126,7 +126,7 @@ describe('Ng New Schematic', () => { expect(packageJson.devDependencies['@tailwindcss/postcss']).toBeDefined(); const stylesContent = tree.readContent('/bar/src/styles.css'); - expect(stylesContent).toContain('@import "tailwindcss";'); + expect(stylesContent).toContain(`@import 'tailwindcss';`); }); it(`should create files with file name style guide '2016'`, async () => { diff --git a/packages/schematics/angular/tailwind/index.ts b/packages/schematics/angular/tailwind/index.ts index e246e5f55bfe..018f0f3b9f95 100644 --- a/packages/schematics/angular/tailwind/index.ts +++ b/packages/schematics/angular/tailwind/index.ts @@ -55,7 +55,7 @@ function addTailwindStyles(options: { project: string }, project: ProjectDefinit if (!stylesheetPath) { const newStylesheetPath = join(project.sourceRoot ?? 'src', 'tailwind.css'); - tree.create(newStylesheetPath, '@import "tailwindcss";\n'); + tree.create(newStylesheetPath, `@import 'tailwindcss';\n`); return updateWorkspace((workspace) => { const project = workspace.projects.get(options.project); @@ -82,8 +82,8 @@ function addTailwindStyles(options: { project: string }, project: ProjectDefinit }); } else { let stylesheetContent = tree.readText(stylesheetPath); - if (!stylesheetContent.includes('@import "tailwindcss";')) { - stylesheetContent += '\n@import "tailwindcss";\n'; + if (!/@import ["']tailwindcss["'];/.test(stylesheetContent)) { + stylesheetContent += `\n@import 'tailwindcss';\n`; tree.overwrite(stylesheetPath, stylesheetContent); } } diff --git a/packages/schematics/angular/tailwind/index_spec.ts b/packages/schematics/angular/tailwind/index_spec.ts index b5f3e346bd83..a70c3b3eef8d 100644 --- a/packages/schematics/angular/tailwind/index_spec.ts +++ b/packages/schematics/angular/tailwind/index_spec.ts @@ -64,17 +64,17 @@ describe('Tailwind Schematic', () => { it('should add tailwind imports to styles.css', async () => { const tree = await schematicRunner.runSchematic('tailwind', { project: 'bar' }, appTree); const stylesContent = tree.readContent('/projects/bar/src/styles.css'); - expect(stylesContent).toContain('@import "tailwindcss";'); + expect(stylesContent).toContain(`@import 'tailwindcss';`); }); it('should not add duplicate tailwind imports to styles.css', async () => { let tree = await schematicRunner.runSchematic('tailwind', { project: 'bar' }, appTree); const stylesContent = tree.readContent('/projects/bar/src/styles.css'); - expect(stylesContent.match(/@import "tailwindcss";/g)?.length).toBe(1); + expect(stylesContent.match(/@import 'tailwindcss';/g)?.length).toBe(1); tree = await schematicRunner.runSchematic('tailwind', { project: 'bar' }, tree); const stylesContentAfter = tree.readContent('/projects/bar/src/styles.css'); - expect(stylesContentAfter.match(/@import "tailwindcss";/g)?.length).toBe(1); + expect(stylesContentAfter.match(/@import 'tailwindcss';/g)?.length).toBe(1); }); describe('with scss styles', () => { @@ -86,7 +86,7 @@ describe('Tailwind Schematic', () => { const tree = await schematicRunner.runSchematic('tailwind', { project: 'bar' }, appTree); expect(tree.exists('/projects/bar/src/tailwind.css')).toBe(true); const stylesContent = tree.readContent('/projects/bar/src/tailwind.css'); - expect(stylesContent).toContain('@import "tailwindcss";'); + expect(stylesContent).toContain(`@import 'tailwindcss';`); }); it('should add tailwind.css to angular.json', async () => { @@ -99,7 +99,7 @@ describe('Tailwind Schematic', () => { it('should not add tailwind imports to styles.scss', async () => { const tree = await schematicRunner.runSchematic('tailwind', { project: 'bar' }, appTree); const stylesContent = tree.readContent('/projects/bar/src/styles.scss'); - expect(stylesContent).not.toContain('@import "tailwindcss";'); + expect(stylesContent).not.toContain(`@import 'tailwindcss';`); }); });