ivanrodricalleja / emotion-swc-plugin Goto Github PK
View Code? Open in Web Editor NEWSWC transform plugin for Emotion
Home Page: https://www.npmjs.com/package/emotion-swc-plugin
SWC transform plugin for Emotion
Home Page: https://www.npmjs.com/package/emotion-swc-plugin
This is a copy of a issue I filed with storybook-addon-swc found here: Karibash/storybook-addon-swc#41
I am getting the following error when trying to build storybook with SWC and the emotion-swc-plugin
Here's the error
Missing export __transform_plugin_process_impl', crates/swc/src/plugin.rs:222:14
note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
thread '<unnamed>' panicked at 'failed to invoke plugin: failed to invoke plugin on 'Some("filepath/.storybook/preview.js-generated-config-entry.js")'
Here's a reproduction repo:
https://github.com/alekangelov/emotion-swc-storybook-bug
Problem is I can't understand if it's this plugins fault or the other one, but leaning towards saying it's the storybook transform plugin, that's why I posted a copy here and not the original.
Maybe can merge to https://github.com/swc-project/plugins/tree/main/packages/emotion
Available plugins
https://github.com/swc-project/plugins
Hello,
I'll be posting here first as you might have an idea of what could be wrong. The issue might be coming from craco-swc or @craco itself. I'm really unsure.
I'm trying to push your plugin when using SWC instead of babel in a CRA app.
The setup
This creates this error when trying to load the plugin
ERROR in ./src/index.js
Module build failed (from ./node_modules/swc-loader/src/index.js):
Error: failed to handle: failed to invoke plugin: failed to invoke `emotion-swc-plugin` as js transform plugin at node_modules\emotion-swc-plugin\target\wasm32-wasi\release\emotion_swc_plugin.wasm
Caused by:
0: RuntimeError: unreachable
at __rust_start_panic (<module>[2232]:0x178fb3)
at rust_panic (<module>[2223]:0x178c95)
at std::panicking::rust_panic_with_hook::hd409e000ec6742c6 (<module>[2222]:0x178c12)
at std::panicking::begin_panic_handler::{{closure}}::h3b7b8f16d0fcb19d (<module>[2207]:0x177e6e)
at std::sys_common::backtrace::__rust_end_short_backtrace::hafc71346839ea24e (<module>[2206]:0x177dad)
at rust_begin_unwind (<module>[2217]:0x178562)
at core::panicking::panic_fmt::ha9171fe3a9e8ee1d (<module>[2372]:0x18751c)
at core::result::unwrap_failed::h3838dd62cbe81d18 (<module>[2424]:0x18e673)
at rkyv::impls::core::<impl rkyv::DeserializeUnsized<[U],D> for [T]>::deserialize_unsized::hfb04456b9b3dee18 (<module>[626]:0x97836)
at swc_ecma_ast::decl::_::<impl rkyv::Deserialize<swc_ecma_ast::decl::Decl,__D> for <swc_ecma_ast::decl::Decl as rkyv::Archive>::Archived>::deserialize::h45f3e744cc68ce52 (<module>[623]:0x9620c)
at swc_ecma_ast::stmt::_::<impl rkyv::Deserialize<swc_ecma_ast::stmt::Stmt,__D> for <swc_ecma_ast::stmt::Stmt as rkyv::Archive>::Archived>::deserialize::h1a3031132198ad96 (<module>[643]:0x9e32c)
at rkyv::impls::core::<impl rkyv::DeserializeUnsized<[U],D> for [T]>::deserialize_unsized::h89b2e063d8ae257b (<module>[627]:0x99918)
at swc_common::plugin::Serialized::deserialize_from_ptr::heaef040c00f1257d (<module>[668]:0xa609f)
at __plugin_process_impl (<module>[364]:0x549f4)
at __plugin_process_impl.command_export (<module>[2512]:0x193970)
1: unreachable
webpack compiled with 1 error
It's difficult to reproduce the error on codesandbox. So I did a small package to demonstrate, this is essentially a yarn create react-app
with minimal addition to switch to craco/swc
SWC configs are in craco.config.js
.
Any help would be appreciated
Thx
Hello,
I tried to follow the install steps described here: basically npm install:
"emotion-swc-plugin": "^0.0.5",
and set the following to be my swcrc
:
{
"test": ".*.(js|jsx|ts(x?))$",
"minify": false,
"sourceMaps": true,
"jsc": {
"target": "es2016",
"loose": true,
"parser": {
"syntax": "typescript",
"tsx": true,
"decorators": false,
"dynamicImport": true
},
"transform": {
"react": {
"runtime": "automatic",
"importSource": "@emotion/react",
"useBuiltins": true,
"refresh": true
}
},
"experimental": {
"plugins": [ ["emotion-swc-plugin", {"sourceMap": false}] ]
}
},
"env": {
"targets": "last 2 versions, Firefox ESR, not IE 11, not op_mini all, not dead"
}
}
Here's the webpack (v5) loader config:
{
test: /\.(js|jsx|ts(x?))$/,
exclude: /node_modules/,
use: {
loader: 'swc-loader',
options: {
parseMap: true,
},
},
}
I'm getting the following error:
ERROR in ./src/index.tsx
Module build failed (from ./node_modules/swc-loader/src/index.js):
Error: failed to handle: failed to invoke plugin: failed to invoke plugin on 'Some("/Users/........../src/index.tsx")'
Caused by:
0: Failed to create plugin instance
1: Error while importing "env"."__lookup_char_pos_source_map_proxy": incompatible import type. Expected Function(FunctionType { params: [I32, I32], results: [I32] }) but received Function(FunctionType { params: [I32, I32, I32], results: [I32] })
Stack backtrace:
0: _napi_register_module_v1
1: _napi_register_module_v1
2: _napi_register_module_v1
3: _napi_register_module_v1
4: _napi_register_module_v1
5: _napi_register_module_v1
6: _napi_register_module_v1
7: _napi_register_module_v1
8: <unknown>
9: _worker
10: __pthread_joiner_wake
Stack backtrace:
0: _napi_register_module_v1
1: _wasmer_vm_raise_trap
2: <unknown>
3: _worker
4: __pthread_joiner_wake
ERROR in Error: Child compilation failed:
Module build failed (from ./node_modules/swc-loader/src/index.js):
Error: failed to handle: failed to invoke plugin: failed to invoke plugin on 'Some("/Users/....../server/index.html.js")'
Caused by:
0: Failed to create plugin instance
1: Error while importing "env"."__lookup_char_pos_source_map_proxy": incompatible import type. Expected Function(FunctionType { params: [I32, I32], results: [I32] }) but received Function(FunctionType { params: [I32, I32, I32], results: [I32] })
Stack backtrace:
0: _napi_register_module_v1
1: _napi_register_module_v1
2: _napi_register_module_v1
3: _napi_register_module_v1
4: _napi_register_module_v1
5: _napi_register_module_v1
6: _napi_register_module_v1
7: _napi_register_module_v1
8: <unknown>
9: _worker
10: __pthread_joiner_wake
Stack backtrace:
0: _napi_register_module_v1
1: _wasmer_vm_raise_trap
2: <unknown>
3: _worker
4: __pthread_joiner_wake
ModuleBuildError: Module build failed (from ./node_modules/swc-loader/src/index.js):
Error: failed to handle: failed to invoke plugin: failed to invoke plugin on 'Some("/Users/...../server/index.html.js")'
Caused by:
0: Failed to create plugin instance
1: Error while importing "env"."__lookup_char_pos_source_map_proxy": incompatible import type. Expected Function(FunctionType { params: [I32, I32], results: [I32] }) but received Function(FunctionType { params: [I32, I32, I32], results: [I32] })
Stack backtrace:
0: _napi_register_module_v1
1: _napi_register_module_v1
2: _napi_register_module_v1
3: _napi_register_module_v1
4: _napi_register_module_v1
5: _napi_register_module_v1
6: _napi_register_module_v1
7: _napi_register_module_v1
8: <unknown>
9: _worker
10: __pthread_joiner_wake
Stack backtrace:
0: _napi_register_module_v1
1: _wasmer_vm_raise_trap
2: <unknown>
3: _worker
4: __pthread_joiner_wake
at processResult (/Users/...../node_modules/webp ack/lib/NormalModule.js:758:19)
at /Users/amit/workspace/code/github.com/ultimateai/dashboard-frontend/node_modules/webpack/lib/NormalM odule.js:860:5
at /Users/amit/workspace/code/github.com/ultimateai/dashboard-frontend/node_modules/webpack/node_module s/loader-runner/lib/LoaderRunner.js:400:11
at /Users/amit/workspace/code/github.com/ultimateai/dashboard-frontend/node_modules/webpack/node_module s/loader-runner/lib/LoaderRunner.js:252:18
at context.callback (/Users/amit/workspace/code/github.com/ultimateai/dashboard-frontend/node_modules/w ebpack/node_modules/loader-runner/lib/LoaderRunner.js:124:13)
at /Users/amit/workspace/code/github.com/ultimateai/dashboard-frontend/node_modules/swc-loader/src/inde x.js:95:25
- NormalModule.js:758 processResult
[dashboard-frontend]/[webpack]/lib/NormalModule.js:758:19
- NormalModule.js:860
[dashboard-frontend]/[webpack]/lib/NormalModule.js:860:5
- LoaderRunner.js:400
[dashboard-frontend]/[webpack]/[loader-runner]/lib/LoaderRunner.js:400:11
- LoaderRunner.js:252
[dashboard-frontend]/[webpack]/[loader-runner]/lib/LoaderRunner.js:252:18
- LoaderRunner.js:124 context.callback
[dashboard-frontend]/[webpack]/[loader-runner]/lib/LoaderRunner.js:124:13
- index.js:95
[dashboard-frontend]/[swc-loader]/src/index.js:95:25
- child-compiler.js:169
[dashboard-frontend]/[html-webpack-plugin]/lib/child-compiler.js:169:18
- Compiler.js:551 finalCallback
[dashboard-frontend]/[webpack]/lib/Compiler.js:551:5
- Compiler.js:577
[dashboard-frontend]/[webpack]/lib/Compiler.js:577:11
- Compiler.js:1196
[dashboard-frontend]/[webpack]/lib/Compiler.js:1196:17
- Hook.js:18 Hook.CALL_ASYNC_DELEGATE [as _callAsync]
[dashboard-frontend]/[webpack]/[tapable]/lib/Hook.js:18:14
- Compiler.js:1192
[dashboard-frontend]/[webpack]/lib/Compiler.js:1192:33
- Compilation.js:2787 finalCallback
[dashboard-frontend]/[webpack]/lib/Compilation.js:2787:11
- Compilation.js:3092
[dashboard-frontend]/[webpack]/lib/Compilation.js:3092:11
1 ERROR in child compilations (Use 'stats.children: true' resp. '--stats-children' for more details)
webpack 5.74.0 compiled with 3 errors in 1950 ms
Any idea what is happening or how could I fix that? Thank you !
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.