Webpack
A Webpack plugin that enables static analysis and dependency collection for Codespark workspaces at build time.
@codespark/plugin-webpack is a Webpack plugin that performs static analysis on your source code during the build process. It automatically collects dependencies and local definitions used by createWorkspace calls, enabling seamless workspace creation from React components without runtime overhead.
Installation
npm install @codespark/plugin-webpackUsage
Add the plugin to your Webpack configuration:
import CodesparkWebpackPlugin from '@codespark/plugin-webpack';
export default {
plugins: [
new CodesparkWebpackPlugin()
]
};With Next.js (Webpack)
You can use this plugin in your Next.js configuration:
import type { NextConfig } from 'next';
import CodesparkWebpackPlugin from '@codespark/plugin-webpack';
const nextConfig: NextConfig = {
/* config options here */
webpack(config) {
config.plugins.push(new CodesparkWebpackPlugin());
return config;
}
};
export default nextConfig;With Next.js (Turbopack)
If you are using Turbopack, the standard Webpack plugin configuration is not supported. Instead, configure it via turbopack.rules:
import type { NextConfig } from 'next';
const nextConfig: NextConfig = {
/* config options here */
turbopack: {
rules: {
'*.tsx': {
loaders: [
{
loader: '@codespark/plugin-webpack/loader'
}
]
}
}
}
};
export default nextConfig;Options
| Option | Type | Default | Description |
|---|---|---|---|
enabled | boolean | true | Enable or disable the plugin |
methods | string[] | ['createWorkspace'] | Function names to transform |
importSource | string[] | ['@codespark/react'] | Package names to detect imports from |
new CodesparkWebpackPlugin({
enabled: true,
methods: ['createWorkspace'],
importSource: ['@codespark/react']
})Last updated on