vercel · feedthejim · Apr 28, 2023 · Apr 24, 2023 · Apr 25, 2023 · Apr 25, 2023
@@ -17,7 +17,7 @@ export function getCssInlinedLinkTags(
 ): string[] {
   const layoutOrPageCssModules = serverCSSManifest.cssImports[filePath]
 
-  const filePathWithoutExt = filePath.replace(/\.[^.]+$/, '')
+  const filePathWithoutExt = filePath.replace(/(\.[A-Za-z0-9]+)+$/, '')
   const cssFilesForEntry = new Set(
     clientReferenceManifest.cssFiles?.[filePathWithoutExt] || []
   )

@@ -0,0 +1,7 @@
+export default function Page() {
+  return (
+    <>
+      <h1>Page</h1>
+    </>
+  )
+}
@@ -0,0 +1,12 @@
+import '../styles/global.css'
+
+export default function Root({ children }) {
+  return (
+    <html className="this-is-the-document-html">
+      <head>
+        <title>{`hello css`}</title>
+      </head>
+      <body className="this-is-the-document-body">{children}</body>
+    </html>
+  )
+}
@@ -0,0 +1,29 @@
+import { createNextDescribe } from 'e2e-utils'
+
+createNextDescribe(
+  'app dir css with pageextensions',
+  {
+    files: __dirname,
+    skipDeployment: true,
+    dependencies: {
+      '@picocss/pico': '1.5.7',
+      react: 'latest',
+      'react-dom': 'latest',
+      sass: 'latest',
+    },
+  },
+  ({ next }) => {
+    describe('css support with pageextensions', () => {
+      describe('page in app directory with pageextention, css should work', () => {
+        it('should support global css inside layout', async () => {
+          const browser = await next.browser('/css-pageextensions')
+          expect(
+            await browser.eval(
+              `window.getComputedStyle(document.querySelector('h1')).color`
+            )
+          ).toBe('rgb(255, 0, 0)')
+        })
+      })
+    })
+  }
+)
@@ -0,0 +1,8 @@
+const nextConfig = {
+  pageExtensions: ['page.jsx', 'page.js'],
+  experimental: {
+    appDir: true,
+  },
+}
+
+module.exports = nextConfig
@@ -0,0 +1,3 @@
+h1 {
+  color: red;
+}