From 08906d2a217107b8071d0cd1a6fb1f95f1248b88 Mon Sep 17 00:00:00 2001
From: Nicholas Cunningham <ndcunningham@gmail.com>
Date: Thu, 31 Oct 2024 15:14:31 -0600
Subject: [PATCH] fix(react): Should only add imports for stylesheet that has a
 style file

closes: #28561
---
 .../files/common/specs/__fileName__.spec.tsx__tmpl__   | 10 +++++-----
 .../application/files/base-rspack/src/main.tsx__tmpl__ |  5 +++--
 .../application/lib/create-application-files.ts        |  2 ++
 3 files changed, 10 insertions(+), 7 deletions(-)

diff --git a/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__ b/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__
index cdc7d302f02e1..b7afef23a1d43 100644
--- a/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__
+++ b/packages/next/src/generators/application/files/common/specs/__fileName__.spec.tsx__tmpl__
@@ -1,14 +1,14 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-<% if (src && !appDir) { %>
+<%_ if (src && !appDir) { _%>
 import Index from '../src/pages/index';
-<% } else if (!appDir) { %>
+<%_ } else if (!appDir) { _%>
 import Index from '../pages/index';
-<% } else if (appDir && src) {%>
+<%_ } else if (appDir && src) { _%>
 import Page from '../src/app/page';
-<% } else { %>
+<%_ } else { _%>
 import Page from '../app/page';
-<% } %>
+<%_ } _%>
 
 describe(<%- appDir ? `'Page'` : `'Index'` %>, () => {
   it('should render successfully', () => {
diff --git a/packages/react/src/generators/application/files/base-rspack/src/main.tsx__tmpl__ b/packages/react/src/generators/application/files/base-rspack/src/main.tsx__tmpl__
index 16706dff0c703..d31437ce4baae 100644
--- a/packages/react/src/generators/application/files/base-rspack/src/main.tsx__tmpl__
+++ b/packages/react/src/generators/application/files/base-rspack/src/main.tsx__tmpl__
@@ -1,9 +1,10 @@
 <%_ if (strict) { _%>import { StrictMode } from 'react';<%_ } _%>
 import * as ReactDOM from 'react-dom/client';
 <%_ if (routing) { _%>import { BrowserRouter } from 'react-router-dom';<%_ } _%>
-
 import App from './app/<%= fileName %>';
-import './styles.<%= style %>'
+<%_ if(hasStyleFile) { _%>
+import './styles.<%= style %>' 
+<%_ } _%>
 
 const root = ReactDOM.createRoot(document.getElementById('root') as HTMLElement);
 <%_ if(strict && !routing) { _%>
diff --git a/packages/react/src/generators/application/lib/create-application-files.ts b/packages/react/src/generators/application/lib/create-application-files.ts
index 029d53d3e60e5..7f7d798043dbf 100644
--- a/packages/react/src/generators/application/lib/create-application-files.ts
+++ b/packages/react/src/generators/application/lib/create-application-files.ts
@@ -40,6 +40,7 @@ export async function createApplicationFiles(
   } else {
     styleSolutionSpecificAppFiles = '../files/style-css-module';
   }
+  const hasStyleFile = ['scss', 'css', 'less'].includes(options.style);
 
   const onBoardingStatus = await createNxCloudOnboardingURLForWelcomeApp(
     host,
@@ -64,6 +65,7 @@ export async function createApplicationFiles(
     appTests,
     inSourceVitestTests: getInSourceVitestTestsTemplate(appTests),
     style: options.style === 'tailwind' ? 'css' : options.style,
+    hasStyleFile,
   };
 
   if (options.bundler === 'vite') {