Codemod Registry
Explore community-led codemods to migrate, optimize, and transform your codebase.
Ready to contribute?
Build your own codemod and share it with the community.
Explore community-led codemods to migrate, optimize, and transform your codebase.
Build your own codemod and share it with the community.
Explore community-led codemods to migrate, optimize, and transform your codebase.
This recipe is a set of codemods that will help migrate webpack v4 to v5. The recipe includes the following codemods: - webpack/v5/migrate-library-target-to-library-object - webpack/v5/json-imports-to-default-imports - webpack/v5/set-target-to-false-and-update-plugins
This codemod migrates the `target` property in Webpack configurations from a function to `false` and moves the function to the `plugins` array. In Webpack 4, it was possible to set the `target` property to a function. However, in Webpack 5, this approach is no longer supported. Instead, the `target` should be set to `false`, and the function should be included in the `plugins` array. This codemod automates the transformation of Webpack configurations to adhere to the new specification. ## Example ### Before ```ts module.exports = { target: WebExtensionTarget(nodeConfig), }; ``` ### After ```ts module.exports = { target: false, plugins: [WebExtensionTarget(nodeConfig)], }; ``` , ### Before ```ts const WebExtensionTarget = require("webpack-extension-target"); module.exports = { target: WebExtensionTarget(nodeConfig), mode: "development", output: { filename: "bundle.js", }, }; ``` ### After ```ts const WebExtensionTarget = require("webpack-extension-target"); module.exports = { target: false, plugins: [WebExtensionTarget(nodeConfig)], mode: "development", output: { filename: "bundle.js", }, }; ``` , ### Before ```ts module.exports = { target: WebExtensionTarget(nodeConfig), optimization: { splitChunks: { chunks: "all", }, }, }; ``` ### After ```ts module.exports = { target: false, plugins: [WebExtensionTarget(nodeConfig)], optimization: { splitChunks: { chunks: "all", }, }, }; ``` , ### Before ```ts module.exports = { target: CustomTargetFunction(config), }; ``` ### After ```ts module.exports = { target: false, plugins: [CustomTargetFunction(config)], }; ```
This codemod migrates imports from JSON modules that use named exports to use default exports instead. This codemod transforms named imports from JSON files into default imports, adhering to the new ECMAScript specification and Webpack v5 compatibility. Named imports from JSON modules are no longer supported. ## Example ### Before ```ts import { version } from "./package.json"; console.log(version); ``` ### After ```ts import pkg from "./package.json"; console.log(pkg.version); ``` , ### Before ```ts import { version, name, description } from "./package.json"; console.log(version, name, description); ``` ### After ```ts import pkg from "./package.json"; console.log(pkg.version, pkg.name, pkg.description); ``` , ### Before ```ts import { data } from './config.json'; console.log(data.nested.key, data.anotherKey); ``` ### After ```ts import config from './config.json'; console.log(config.data.nested.key, config.data.anotherKey); ``` , ### Before ```ts import { key1, key2 } from './config.json'; console.log(key1, key2); ``` ### After ```ts import config from './config.json'; console.log(config.key1, config.key2); ```
This codemod migrates the `output.library` and `output.libraryTarget` properties in Webpack configurations to the new format required by Webpack 5. It changes `output.library` to `output.library.name` and `output.libraryTarget` to `output.library.type`. ## Example ### Before ```ts module.exports = { output: { library: "MyLibrary", libraryTarget: "commonjs2", }, }; ``` ### After ```ts module.exports = { output: { library: { name: "MyLibrary", type: "commonjs2", }, }, }; ``` , ### Before ```ts module.exports = { output: { library: "MyLibrary", libraryTarget: "commonjs2", filename: "bundle.js", }, }; ``` ### After ```ts module.exports = { output: { library: { name: "MyLibrary", type: "commonjs2", }, filename: "bundle.js", }, }; ``` , ### Before ```ts module.exports = { output: { library: "MyLibrary", }, }; ``` ### After ```ts module.exports = { output: { library: { name: "MyLibrary", type: undefined, }, }, }; ``` , ### Before ```ts module.exports = { output: { library: "MyLibrary", libraryTarget: "umd", path: "./dist", }, }; ``` ### After ```ts module.exports = { output: { library: { name: "MyLibrary", type: "umd", }, path: "./dist", }, }; ```
## Removal of useNavigate Hook This codemod updates your codebase by replacing the deprecated `useNavigate` hook from `@gatsbyjs/reach-router` with the `navigate` function from `gatsby`. This change is necessary for compatibility with React 18 and ensures that your application leverages the latest advancements in Gatsby. ## Example ### Before ```ts import { useNavigate } from "@gatsbyjs/reach-router"; ``` ### After ```ts import { navigate } from "gatsby"; ``` , ### Before ```ts import React from "react"; import { useNavigate } from "@gatsbyjs/reach-router"; export default function MyComponent() { const navigate = useNavigate(); const handleClick = () => { navigate('/about'); }; return < button onClick = { handleClick } > Go to About Page < /button>; } ``` ### After ```ts import React from "react"; import { navigate } from "gatsby"; export default function MyComponent() { const handleClick = () => { navigate('/about'); }; return < button onClick = { handleClick } > Go to About Page < /button>; } ```
This recipe is a set of codemods that will help migrate sentry.js v7.x to v8.x. The recipe includes the following codemods: - sentry/v8/removal-Severity-Enum - sentry/v8/remove-replay-package-and-update-integration - sentry/v8/removal-of-addGlobalEventProcessor - sentry/v8/Removal-Sentry.configureScope-method - sentry/v8/replace-span-status-from-http-code - sentry/v8/removal-of-void-from-transport-return-types [codemod Registry](https://codemod.com/registry/sentry-v8-migration-recipe)
This codemod removes the `void` return type from the `send` method of the `Transport` interface, ensuring that the method always returns a `TransportMakeRequestResponse` in the promise. This change aligns with the updated requirements in Sentry 8.x. [codemod Registry](https://codemod.com/registry/sentry-v8-removal-of-void-from-transport-return-types) ## Example ### Before ```ts interface Transport { send(event: Event): Promise < void | TransportMakeRequestResponse > ; } ``` ### After ```ts interface Transport { send(event: Event): Promise < TransportMakeRequestResponse > ; } ``` , ### Before ```ts type TransportSend = ( event: Event, ) => Promise < void | TransportMakeRequestResponse > ; ``` ### After ```ts type TransportSend = (event: Event) => Promise < TransportMakeRequestResponse > ; ```
This codemod removes the import statement for the @sentry/replay package and replaces instances of new Replay() with Sentry.replayIntegration(), aligning with the latest Sentry SDK practices. - **Import Removal:** Eliminates the import statement for Replay from the @sentry/replay package. - **Integration Replacement:** Transforms all occurrences of new Replay() into Sentry.replayIntegration() to ensure compatibility with the latest Sentry SDK. [codemod Registry](https://codemod.com/registry/sentry-v8-remove-replay-package-and-update-integration) ## Example ### Before ```ts import { Replay } from '@sentry/replay'; Sentry.init({ dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0', integrations: [new Replay()], }); ``` ### After ```ts Sentry.init({ dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0', integrations: [Sentry.replayIntegration()], }); ``` , ### Before ```ts import { Replay } from '@sentry/replay'; Sentry.init({ dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0', integrations: [ new Replay(), // Other integrations ], }); ``` ### After ```ts Sentry.init({ dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0', integrations: [ Sentry.replayIntegration(), // Other integrations ], }); ``` , ### Before ```ts import { Replay } from '@sentry/replay'; Sentry.init({ dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0', integrations: [ new Replay({ maskAllText: true, blockAllMedia: true, }), ], }); ``` ### After ```ts Sentry.init({ dsn: 'https://examplePublicKey@o0.ingest.sentry.io/0', integrations: [ Sentry.replayIntegration({ maskAllText: true, blockAllMedia: true, }), ], }); ```
This codemod facilitates the migration from Sentry v7.x to v8.x by replacing the deprecated `addGlobalEventProcessor` function with the new `getGlobalScope().addEventProcessor` method. [codemod Registry](https://codemod.com/registry/sentry-v8-removal-of-addGlobalEventProcessor) ## Example ### Before ```ts Sentry.addGlobalEventProcessor((event) => { delete event.extra; return event; }); ``` ### After ```ts Sentry.getGlobalScope().addEventProcessor((event) => { delete event.extra; return event; }); ``` , ### Before ```ts Sentry.addGlobalEventProcessor((event) => { delete event.extra; return event; }); Sentry.addGlobalEventProcessor((event) => { delete event.tags; return event; }); ``` ### After ```ts Sentry.getGlobalScope().addEventProcessor((event) => { delete event.extra; return event; }); Sentry.getGlobalScope().addEventProcessor((event) => { delete event.tags; return event; }); ``` , ### Before ```ts function processEvent(event) { delete event.extra; return event; } Sentry.addGlobalEventProcessor(processEvent); ``` ### After ```ts function processEvent(event) { delete event.extra; return event; } Sentry.getGlobalScope().addEventProcessor(processEvent); ``` , ### Before ```ts Sentry.addGlobalEventProcessor((event) => { if (event.level === 'error') { delete event.extra; } return event; }); ``` ### After ```ts Sentry.getGlobalScope().addEventProcessor((event) => { if (event.level === 'error') { delete event.extra; } return event; }); ```
This codemod replaces spanStatusfromHttpCode with getSpanStatusFromHttpCode in Sentry 8.x. It transforms instances of spanStatusfromHttpCode to use the new getSpanStatusFromHttpCode function. ## Example ### Before ```ts const spanStatus = spanStatusfromHttpCode(200); ``` ### After ```ts const spanStatus = getSpanStatusFromHttpCode(200); ``` , ### Before ```ts const status1 = spanStatusfromHttpCode(404); const status2 = spanStatusfromHttpCode(500); ``` ### After ```ts const status1 = getSpanStatusFromHttpCode(404); const status2 = getSpanStatusFromHttpCode(500); ``` , ### Before ```ts let currentStatus = spanStatusfromHttpCode(302); ``` ### After ```ts let currentStatus = getSpanStatusFromHttpCode(302); ``` , ### Before ```ts logSpanStatus(spanStatusfromHttpCode(201)); ``` ### After ```ts logSpanStatus(getSpanStatusFromHttpCode(201)); ```
This codemod facilitates the migration from Sentry version 7.x to 8.x by removing the deprecated Sentry.configureScope method. Instead, it transforms the code to utilize Sentry.getCurrentScope() for accessing and mutating the current scope. This change simplifies the API and aligns with the latest Sentry practices. ## Example ### Before ```ts Sentry.configureScope((scope) => { scope.setTag('key', 'value'); }); ``` ### After ```ts Sentry.getCurrentScope().setTag('key', 'value'); ``` , ### Before ```ts Sentry.configureScope((scope) => { scope.setTag('user', '123'); }); ``` ### After ```ts Sentry.getCurrentScope().setTag('user', '123'); ``` , ### Before ```ts Sentry.configureScope((scope) => { scope.setUser({ id: '456', email: 'user@example.com' }); }); ``` ### After ```ts Sentry.getCurrentScope().setUser({ id: '456', email: 'user@example.com' }); ``` , ### Before ```ts Sentry.configureScope((scope) => { scope.setExtra('key', 'value'); }); ``` ### After ```ts Sentry.getCurrentScope().setExtra('key', 'value'); ``` , ### Before ```ts Sentry.configureScope((scope) => { scope.setTag('level', 'info'); scope.setTag('action', 'click'); }); ``` ### After ```ts Sentry.getCurrentScope().setTag('action', 'click'); Sentry.getCurrentScope().setTag('level', 'info'); ```
Codemod to replace the deprecated Severity enum with the SeverityLevel type in Sentry from version 7.x to 8.x. ## Example ### Before ```ts import { Severity } from '@sentry/types'; ``` ### After ```ts import { SeverityLevel } from '@sentry/types'; ``` , ### Before ```ts const level = Severity.error; ``` ### After ```ts const level: SeverityLevel = 'error'; ``` , ### Before ```ts const warningLevel = Severity.warning; const infoLevel = Severity.info; ``` ### After ```ts const warningLevel: SeverityLevel = 'warning'; const infoLevel: SeverityLevel = 'info'; ``` , ### Before ```ts let currentLevel = Severity.fatal; ``` ### After ```ts let currentLevel: SeverityLevel = 'fatal'; ``` , ### Before ```ts function getSeverity() { return Severity.debug; } ``` ### After ```ts function getSeverity(): SeverityLevel { return 'debug'; } ```
Build your own codemod and share it with the community.