1
1
import mdx from "@next/mdx" ;
2
+ import { readFileSync } from "fs" ;
3
+ import { join , dirname } from "path" ;
4
+ import { fileURLToPath } from "url" ;
5
+
2
6
const withMDX = mdx ( {
3
7
options : {
4
8
providerImportSource : "@mdx-js/react" ,
5
9
} ,
6
10
} ) ;
7
11
12
+ const __dirname = dirname ( fileURLToPath ( import . meta. url ) ) ;
13
+
14
+ /**
15
+ * The names of the packages that come from the same monorepo as this package.
16
+ * We want these to be transpiled by Next.js because we are directly importing
17
+ * the source typescript files from these packages.
18
+ */
19
+ const references = JSON . parse (
20
+ readFileSync ( join ( __dirname , "tsconfig.json" ) , "utf-8" ) ,
21
+ ) . references . map ( ( { path } ) => {
22
+ return JSON . parse (
23
+ readFileSync ( join ( __dirname , path , "package.json" ) , "utf-8" ) ,
24
+ ) . name ;
25
+ } ) ;
26
+
8
27
/** @type {import('next').NextConfig } */
9
28
const nextConfig = {
10
29
webpack ( config ) {
@@ -14,11 +33,24 @@ const nextConfig = {
14
33
use : [ "@svgr/webpack" ] ,
15
34
} ) ;
16
35
36
+ // Set our custom condition for the bundler so that we directly use
37
+ // typescript from packages in our monorepo, which makes hot-reloading
38
+ // smoother. Based on
39
+ // https://github.com/vercel/next.js/discussions/33813#discussioncomment-7457277
40
+ config . plugins . push ( {
41
+ apply ( compiler ) {
42
+ compiler . hooks . afterEnvironment . tap ( "NextEntryPlugin" , ( ) => {
43
+ compiler . options . resolve . conditionNames . push ( "cursorless:bundler" ) ;
44
+ } ) ;
45
+ } ,
46
+ } ) ;
47
+
17
48
return config ;
18
49
} ,
19
50
experimental : {
20
51
mdxRs : true ,
21
52
} ,
53
+ transpilePackages : references ,
22
54
reactStrictMode : true ,
23
55
output : "export" ,
24
56
} ;
0 commit comments