Security News
Introducing the Socket Python SDK
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
@storybook/core-webpack
Advanced tools
The @storybook/core-webpack package is a part of the Storybook ecosystem, specifically designed to customize and extend Storybook's Webpack configurations. It allows developers to modify the default Webpack configuration used by Storybook to better suit their project's needs, including adding loaders, plugins, and modifying existing configurations. This package is essential for projects that require a high degree of customization for their Storybook setup, enabling seamless integration with a wide range of web development tools and workflows.
Customizing Webpack Config
This feature allows developers to customize the Webpack configuration used by Storybook. The code sample demonstrates how to merge a custom Webpack configuration with Storybook's default configuration, specifically adding support for SCSS files.
const { merge } = require('webpack-merge');
module.exports = ({ config }) => {
return merge(config, {
// Custom Webpack configuration
module: {
rules: [{ test: /\.scss$/, use: ['style-loader', 'css-loader', 'sass-loader'] }]
}
});
};
Adding Webpack Plugins
Developers can extend Storybook's Webpack configuration by adding additional Webpack plugins. The code sample shows how to add a custom plugin to the configuration.
const SomeWebpackPlugin = require('some-webpack-plugin');
module.exports = ({ config }) => {
config.plugins.push(new SomeWebpackPlugin());
return config;
};
Modifying Existing Loaders
This functionality allows for the modification of existing loaders in the Webpack configuration. The code sample illustrates how to find and modify a specific loader to add an additional 'some-loader' for handling files.
module.exports = ({ config }) => {
const rules = config.module.rules;
const someRuleIndex = rules.findIndex(rule => rule.test.toString() === '/\.somefile$/');
if (someRuleIndex !== -1) {
rules[someRuleIndex].use.push('some-loader');
}
return config;
};
While not a Storybook-specific package, webpack-merge is often used in conjunction with @storybook/core-webpack for merging custom Webpack configurations with Storybook's default. It provides a streamlined way to combine configurations, which is essential for complex setups.
customize-cra is designed for overriding Create React App's Webpack configurations without 'ejecting'. It offers a similar value proposition to @storybook/core-webpack but is specifically tailored for CRA projects. Unlike @storybook/core-webpack, it doesn't directly integrate with Storybook but demonstrates the demand for customization in tooling environments.
Common utilities used across @storybook/core-server
(manager UI configuration) and @storybook/builder-webpack{4,5}
(preview configuration).
This is a lot of code extracted for convenience, not because it made sense.
Supporting multiple version of webpack and this duplicating a large portion of code that was never meant to be generic caused this.
At some point we'll refactor this, it's likely a lot of this code is dead or barely used.
8.2.0
Hold onto your hats! Storybook 8.2 has dropped, packed with a treasure trove of new features and bug fixes:
beforeAll
play
functiontocbot
- #28318, thanks @shilman!--no-dev
option to init
- #26918, thanks @fastfrwrd!--dev
and --no-dev
options to storybook init
CLI - #26918, thanks @fastfrwrd!@storybook/addon-svelte-csf
when initializing new projects - #27070, thanks @benmccann!beforeAll
hook - #28255, thanks @ghengeveld!pkg-dir
to fd-package-json
- #28270, thanks @43081j!loading
-> rendering
-> playing
- #28431, thanks @kasperpeulen!.stories.mdx
handling - #25973, thanks @JReinhold!CJS
for core/components
- #28440, thanks @ndelangen!preview.js
globals
to initialGlobals
- #27517, thanks @shilman!markdown-to-jsx
to v7.4.5 - #26694, thanks @xyy94813!webpack-virtual-modules
to 0.6.0 - #27102, thanks @fyodorovandrei!read-pkg-up
to fd-package-json
- #28272, thanks @43081j!doctrine
with jsdoc-type-pratt-parser
- #26305, thanks @43081j!Stories
block, error when referenced in MDX - #28434, thanks @kasperpeulen!Typeset
Doc block fontSizes
type - #26475, thanks @noranda!env.bugfixes
in SWC so destructuring is never transpiled - #28363, thanks @kasperpeulen!mount
in react, svelte, and vue renderers - #28385, thanks @kasperpeulen!CompatibleString
- #27180, thanks @sni-J!FAQs
Storybook framework-agnostic API
The npm package @storybook/core-webpack receives a total of 2,293,275 weekly downloads. As such, @storybook/core-webpack popularity was classified as popular.
We found that @storybook/core-webpack demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 11 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
The initial version of the Socket Python SDK is now on PyPI, enabling developers to more easily interact with the Socket REST API in Python projects.
Security News
Floating dependency ranges in npm can introduce instability and security risks into your project by allowing unverified or incompatible versions to be installed automatically, leading to unpredictable behavior and potential conflicts.
Security News
A new Rust RFC proposes "Trusted Publishing" for Crates.io, introducing short-lived access tokens via OIDC to improve security and reduce risks associated with long-lived API tokens.