From e97100c5eaff9351ab8b6c83c5341994f22f60e9 Mon Sep 17 00:00:00 2001 From: OJ Kwon <1210596+kwonoj@users.noreply.github.com> Date: Wed, 12 Apr 2023 13:05:18 -0700 Subject: [PATCH] feat(turbopack): support initial compiler.emotion / compiler.styledComponents flag (#47991) ### What? Related with WEB-669 and initial support for [WEB-670](https://linear.app/vercel/issue/WEB-670), allows to consume compiler.emotion with latest turbopack. I was trying to make additional changes to make test fully pass, but there are some other failures around so this change cannot able to pass existing tests yet. Turbopack changes: https://github.com/vercel/turbo/pull/4482 --- packages/next-swc/Cargo.lock | 60 +++++++------- packages/next-swc/Cargo.toml | 6 +- .../next-core/src/next_client/context.rs | 12 ++- .../crates/next-core/src/next_config.rs | 25 +++++- .../next-core/src/next_server/context.rs | 14 +++- .../crates/next-core/src/transform_options.rs | 79 ++++++++++++++++++- packages/next/src/lib/turbopack-warning.ts | 2 + test/development/basic/emotion-swc.test.ts | 8 +- .../emotion-swc/next.turbopack.config.js | 9 +++ 9 files changed, 171 insertions(+), 44 deletions(-) create mode 100644 test/development/basic/emotion-swc/next.turbopack.config.js diff --git a/packages/next-swc/Cargo.lock b/packages/next-swc/Cargo.lock index 84ee3881d93d4..6d4abb41faf2a 100644 --- a/packages/next-swc/Cargo.lock +++ b/packages/next-swc/Cargo.lock @@ -386,7 +386,7 @@ dependencies = [ [[package]] name = "auto-hash-map" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "serde", ] @@ -3302,7 +3302,7 @@ dependencies = [ [[package]] name = "node-file-trace" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "serde", @@ -6687,7 +6687,7 @@ dependencies = [ [[package]] name = "turbo-binding" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "auto-hash-map", "mdxjs", @@ -6724,7 +6724,7 @@ dependencies = [ [[package]] name = "turbo-malloc" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "mimalloc", ] @@ -6732,7 +6732,7 @@ dependencies = [ [[package]] name = "turbo-tasks" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "auto-hash-map", @@ -6762,7 +6762,7 @@ dependencies = [ [[package]] name = "turbo-tasks-build" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "cargo-lock", @@ -6774,7 +6774,7 @@ dependencies = [ [[package]] name = "turbo-tasks-bytes" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "bytes", @@ -6789,7 +6789,7 @@ dependencies = [ [[package]] name = "turbo-tasks-env" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "dotenvy", @@ -6803,7 +6803,7 @@ dependencies = [ [[package]] name = "turbo-tasks-fetch" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "indexmap", @@ -6820,7 +6820,7 @@ dependencies = [ [[package]] name = "turbo-tasks-fs" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "auto-hash-map", @@ -6849,7 +6849,7 @@ dependencies = [ [[package]] name = "turbo-tasks-hash" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "base16", "hex", @@ -6861,7 +6861,7 @@ dependencies = [ [[package]] name = "turbo-tasks-macros" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "convert_case 0.6.0", @@ -6875,7 +6875,7 @@ dependencies = [ [[package]] name = "turbo-tasks-macros-shared" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "proc-macro2", "quote", @@ -6885,7 +6885,7 @@ dependencies = [ [[package]] name = "turbo-tasks-memory" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "auto-hash-map", @@ -6907,7 +6907,7 @@ dependencies = [ [[package]] name = "turbo-tasks-testing" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "auto-hash-map", @@ -6919,7 +6919,7 @@ dependencies = [ [[package]] name = "turbopack" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "async-recursion", @@ -6945,7 +6945,7 @@ dependencies = [ [[package]] name = "turbopack-cli-utils" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "clap 4.1.11", @@ -6961,7 +6961,7 @@ dependencies = [ [[package]] name = "turbopack-core" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "async-trait", @@ -6988,7 +6988,7 @@ dependencies = [ [[package]] name = "turbopack-create-test-app" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "clap 4.1.11", @@ -7001,7 +7001,7 @@ dependencies = [ [[package]] name = "turbopack-css" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "async-trait", @@ -7023,7 +7023,7 @@ dependencies = [ [[package]] name = "turbopack-dev" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "indexmap", @@ -7042,7 +7042,7 @@ dependencies = [ [[package]] name = "turbopack-dev-server" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "async-compression", @@ -7075,7 +7075,7 @@ dependencies = [ [[package]] name = "turbopack-ecmascript" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "async-trait", @@ -7111,7 +7111,7 @@ dependencies = [ [[package]] name = "turbopack-env" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "serde", @@ -7126,7 +7126,7 @@ dependencies = [ [[package]] name = "turbopack-json" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "serde", @@ -7141,7 +7141,7 @@ dependencies = [ [[package]] name = "turbopack-mdx" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "mdxjs", @@ -7156,7 +7156,7 @@ dependencies = [ [[package]] name = "turbopack-node" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "async-stream", @@ -7190,7 +7190,7 @@ dependencies = [ [[package]] name = "turbopack-static" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "serde", @@ -7206,7 +7206,7 @@ dependencies = [ [[package]] name = "turbopack-swc-utils" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "swc_core", "turbo-tasks", @@ -7217,7 +7217,7 @@ dependencies = [ [[package]] name = "turbopack-test-utils" version = "0.1.0" -source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230411.2#8a6c4b81f4952627cfac60b1a77240c1ea02ec4b" +source = "git+https://github.com/vercel/turbo.git?tag=turbopack-230412.2#d1df1a810f0fec704ebcf2201691261d1249703d" dependencies = [ "anyhow", "once_cell", diff --git a/packages/next-swc/Cargo.toml b/packages/next-swc/Cargo.toml index c6ac26954d797..adc29e75a7134 100644 --- a/packages/next-swc/Cargo.toml +++ b/packages/next-swc/Cargo.toml @@ -47,11 +47,11 @@ swc_emotion = { version = "0.29.10" } testing = { version = "0.31.31" } # Turbo crates -turbo-binding = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230411.2" } +turbo-binding = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230412.2" } # [TODO]: need to refactor embed_directory! macro usages, as well as resolving turbo_tasks::function, macros.. -turbo-tasks = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230411.2" } +turbo-tasks = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230412.2" } # [TODO]: need to refactor embed_directory! macro usage in next-core -turbo-tasks-fs = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230411.2" } +turbo-tasks-fs = { git = "https://github.com/vercel/turbo.git", tag = "turbopack-230412.2" } # General Deps diff --git a/packages/next-swc/crates/next-core/src/next_client/context.rs b/packages/next-swc/crates/next-core/src/next_client/context.rs index dacbc5b36af90..75d01dc2d25e5 100644 --- a/packages/next-swc/crates/next-core/src/next_client/context.rs +++ b/packages/next-swc/crates/next-core/src/next_client/context.rs @@ -48,8 +48,8 @@ use crate::{ }, react_refresh::assert_can_resolve_react_refresh, transform_options::{ - get_decorators_transform_options, get_jsx_transform_options, - get_typescript_transform_options, + get_decorators_transform_options, get_emotion_compiler_config, get_jsx_transform_options, + get_styled_components_compiler_config, get_typescript_transform_options, }, util::foreign_code_context_condition, }; @@ -175,6 +175,8 @@ pub async fn get_client_module_options_context( .clone_if() }; + let enable_emotion = *get_emotion_compiler_config(next_config).await?; + let module_options_context = ModuleOptionsContext { custom_ecmascript_transforms: vec![EcmascriptInputTransform::ServerDirective( StringVc::cell("TODO".to_string()), @@ -184,14 +186,16 @@ pub async fn get_client_module_options_context( ..Default::default() }; + let enable_styled_components = *get_styled_components_compiler_config(next_config).await?; + let module_options_context = ModuleOptionsContext { // We don't need to resolve React Refresh for each module. Instead, // we try resolve it once at the root and pass down a context to all // the modules. enable_jsx: Some(jsx_runtime_options), - enable_emotion: true, + enable_emotion, enable_react_refresh, - enable_styled_components: true, + enable_styled_components, enable_styled_jsx: true, enable_postcss_transform: Some(PostCssTransformOptions { postcss_package: Some(get_postcss_package_mapping(project_path)), diff --git a/packages/next-swc/crates/next-core/src/next_config.rs b/packages/next-swc/crates/next-core/src/next_config.rs index 053be2104bacf..1d02203a73480 100644 --- a/packages/next-swc/crates/next-core/src/next_config.rs +++ b/packages/next-swc/crates/next-core/src/next_config.rs @@ -28,7 +28,10 @@ use turbo_binding::{ execution_context::{ExecutionContext, ExecutionContextVc}, transforms::webpack::{WebpackLoaderConfigItems, WebpackLoaderConfigItemsVc}, }, - turbopack::evaluate_context::node_evaluate_asset_context, + turbopack::{ + evaluate_context::node_evaluate_asset_context, + module_options::{EmotionTransformConfig, StyledComponentsTransformConfig}, + }, }, }; use turbo_tasks::{ @@ -55,9 +58,11 @@ pub struct NextConfig { pub rewrites: Rewrites, pub transpile_packages: Option>, + // Partially supported + pub compiler: Option, + // unsupported cross_origin: Option, - compiler: Option, amp: AmpConfig, analytics_id: String, asset_prefix: String, @@ -415,12 +420,28 @@ enum MiddlewarePrefetchType { Flexible, } +#[derive(Clone, Debug, PartialEq, Serialize, Deserialize, TraceRawVcs)] +#[serde(untagged)] +pub enum EmotionTransformOptionsOrBoolean { + Boolean(bool), + Options(EmotionTransformConfig), +} + +#[derive(Clone, Debug, PartialEq, Serialize, Deserialize, TraceRawVcs)] +#[serde(untagged)] +pub enum StyledComponentsTransformOptionsOrBoolean { + Boolean(bool), + Options(StyledComponentsTransformConfig), +} + #[derive(Clone, Debug, PartialEq, Serialize, Deserialize, TraceRawVcs)] #[serde(rename_all = "camelCase")] pub struct CompilerConfig { pub react_remove_properties: Option, pub relay: Option, + pub emotion: Option, pub remove_console: Option, + pub styled_components: Option, } #[derive(Clone, Debug, PartialEq, Serialize, Deserialize, TraceRawVcs)] diff --git a/packages/next-swc/crates/next-core/src/next_server/context.rs b/packages/next-swc/crates/next-core/src/next_server/context.rs index 75f427eee4f33..c8192c762b923 100644 --- a/packages/next-swc/crates/next-core/src/next_server/context.rs +++ b/packages/next-swc/crates/next-core/src/next_server/context.rs @@ -32,8 +32,8 @@ use crate::{ next_config::NextConfigVc, next_import_map::get_next_server_import_map, transform_options::{ - get_decorators_transform_options, get_jsx_transform_options, - get_typescript_transform_options, + get_decorators_transform_options, get_emotion_compiler_config, get_jsx_transform_options, + get_styled_components_compiler_config, get_typescript_transform_options, }, util::foreign_code_context_condition, }; @@ -235,6 +235,8 @@ pub async fn get_server_module_options_context( let tsconfig = get_typescript_transform_options(project_path); let decorators_options = get_decorators_transform_options(project_path); let jsx_runtime_options = get_jsx_transform_options(project_path); + let enable_emotion = *get_emotion_compiler_config(next_config).await?; + let enable_styled_components = *get_styled_components_compiler_config(next_config).await?; let module_options_context = match ty.into_value() { ServerContextType::Pages { .. } | ServerContextType::PagesData { .. } => { @@ -245,6 +247,8 @@ pub async fn get_server_module_options_context( ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), enable_styled_jsx: true, + enable_emotion, + enable_styled_components, enable_postcss_transform, enable_webpack_loaders, enable_typescript_transform: Some(tsconfig), @@ -270,6 +274,8 @@ pub async fn get_server_module_options_context( ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), enable_styled_jsx: true, + enable_emotion, + enable_styled_components, enable_postcss_transform, enable_webpack_loaders, enable_typescript_transform: Some(tsconfig), @@ -300,6 +306,8 @@ pub async fn get_server_module_options_context( }; ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), + enable_emotion, + enable_styled_components, enable_postcss_transform, enable_webpack_loaders, enable_typescript_transform: Some(tsconfig), @@ -337,7 +345,9 @@ pub async fn get_server_module_options_context( }; ModuleOptionsContext { enable_jsx: Some(jsx_runtime_options), + enable_emotion, enable_styled_jsx: true, + enable_styled_components, enable_postcss_transform, enable_webpack_loaders, enable_typescript_transform: Some(tsconfig), diff --git a/packages/next-swc/crates/next-core/src/transform_options.rs b/packages/next-swc/crates/next-core/src/transform_options.rs index 335112ceccf20..05de3fddef40f 100644 --- a/packages/next-swc/crates/next-core/src/transform_options.rs +++ b/packages/next-swc/crates/next-core/src/transform_options.rs @@ -7,12 +7,18 @@ use turbo_binding::turbopack::{ }, ecmascript::typescript::resolve::{read_from_tsconfigs, read_tsconfigs, tsconfig}, turbopack::module_options::{ - DecoratorsKind, DecoratorsOptions, DecoratorsOptionsVc, JsxTransformOptions, - JsxTransformOptionsVc, TypescriptTransformOptions, TypescriptTransformOptionsVc, + DecoratorsKind, DecoratorsOptions, DecoratorsOptionsVc, EmotionTransformConfig, + EmotionTransformConfigVc, JsxTransformOptions, JsxTransformOptionsVc, + OptionEmotionTransformConfigVc, OptionStyledComponentsTransformConfigVc, + StyledComponentsTransformConfig, TypescriptTransformOptions, TypescriptTransformOptionsVc, }, }; use turbo_tasks_fs::{FileJsonContentVc, FileSystemPathVc}; +use crate::next_config::{ + EmotionTransformOptionsOrBoolean, NextConfigVc, StyledComponentsTransformOptionsOrBoolean, +}; + async fn get_typescript_options( project_path: FileSystemPathVc, ) -> Option> { @@ -152,3 +158,72 @@ pub async fn get_jsx_transform_options( Ok(react_transform_options.cell()) } + +#[turbo_tasks::function] +pub async fn get_emotion_compiler_config( + next_config: NextConfigVc, +) -> Result { + let emotion_compiler_config = next_config + .await? + .compiler + .as_ref() + .map(|value| { + value + .emotion + .as_ref() + .map(|value| { + let options = match value { + EmotionTransformOptionsOrBoolean::Boolean(true) => { + Some(EmotionTransformConfigVc::cell(EmotionTransformConfig { + ..Default::default() + })) + } + EmotionTransformOptionsOrBoolean::Boolean(false) => None, + EmotionTransformOptionsOrBoolean::Options(value) => { + Some(EmotionTransformConfigVc::cell(value.clone())) + } + }; + + OptionEmotionTransformConfigVc::cell(options) + }) + .unwrap_or_else(|| OptionEmotionTransformConfigVc::cell(None)) + }) + .unwrap_or_else(|| OptionEmotionTransformConfigVc::cell(None)); + + Ok(emotion_compiler_config) +} + +#[turbo_tasks::function] +pub async fn get_styled_components_compiler_config( + next_config: NextConfigVc, +) -> Result { + let styled_components_compiler_config = next_config + .await? + .compiler + .as_ref() + .map(|value| { + value + .styled_components + .as_ref() + .map(|value| { + let options = match value { + StyledComponentsTransformOptionsOrBoolean::Boolean(true) => Some( + StyledComponentsTransformConfig { + ..Default::default() + } + .cell(), + ), + StyledComponentsTransformOptionsOrBoolean::Boolean(false) => None, + StyledComponentsTransformOptionsOrBoolean::Options(value) => { + Some(value.clone().cell()) + } + }; + + OptionStyledComponentsTransformConfigVc::cell(options) + }) + .unwrap_or_else(|| OptionStyledComponentsTransformConfigVc::cell(None)) + }) + .unwrap_or_else(|| OptionStyledComponentsTransformConfigVc::cell(None)); + + Ok(styled_components_compiler_config) +} diff --git a/packages/next/src/lib/turbopack-warning.ts b/packages/next/src/lib/turbopack-warning.ts index e9a5a4136b5e3..38e670d099d2c 100644 --- a/packages/next/src/lib/turbopack-warning.ts +++ b/packages/next/src/lib/turbopack-warning.ts @@ -7,6 +7,8 @@ const supportedTurbopackNextConfigOptions = [ 'configFileName', 'env', 'experimental.appDir', + 'compiler.emotion', + 'compiler.styledComponents', 'experimental.serverComponentsExternalPackages', 'experimental.turbo', 'images', diff --git a/test/development/basic/emotion-swc.test.ts b/test/development/basic/emotion-swc.test.ts index 83cd65f50aa26..e10d58b8cbb8c 100644 --- a/test/development/basic/emotion-swc.test.ts +++ b/test/development/basic/emotion-swc.test.ts @@ -2,11 +2,13 @@ import { join } from 'path' import webdriver from 'next-webdriver' import { createNext, FileRef } from 'e2e-utils' import { NextInstance } from 'test/lib/next-modes/base' +import { shouldRunTurboDevTest } from '../../lib/next-test-utils' describe('emotion SWC option', () => { let next: NextInstance beforeAll(async () => { + const useTurbo = !!process.env.TEST_WASM ? false : shouldRunTurboDevTest() next = await createNext({ files: { 'jsconfig.json': new FileRef( @@ -14,11 +16,15 @@ describe('emotion SWC option', () => { ), pages: new FileRef(join(__dirname, 'emotion-swc/pages')), shared: new FileRef(join(__dirname, 'emotion-swc/shared')), + // Stopgap until turobpack supports full next.config.js for `reactStrictMode` 'next.config.js': new FileRef( - join(__dirname, 'emotion-swc/next.config.js') + useTurbo + ? join(__dirname, 'emotion-swc/next.turbopack.config.js') + : join(__dirname, 'emotion-swc/next.config.js') ), }, dependencies: { + '@emotion/cache': '^10.0.29', '@emotion/core': '^10.0.35', '@emotion/styled': '^10.0.27', }, diff --git a/test/development/basic/emotion-swc/next.turbopack.config.js b/test/development/basic/emotion-swc/next.turbopack.config.js new file mode 100644 index 0000000000000..71dbfec033b16 --- /dev/null +++ b/test/development/basic/emotion-swc/next.turbopack.config.js @@ -0,0 +1,9 @@ +/** @type {import('next').NextConfig} */ + +const nextConfig = { + compiler: { + emotion: true, + }, +} + +module.exports = nextConfig