Product
Introducing SSO
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
bookcase-builder
Advanced tools
Readme
"Put all the books in the bookcase."
Compose storybooks for an overview.
English | 简体中文
📢 CLI
bookcase-builder
asbb
.
In the monorepo project, usually we will have a storybook for each package, and use CI to deploy them to the server.
packages
|--- packages-1
|--- .storybook
|--- public
|--- packages-2
|--- .storybook
|--- public
|--- packages-3
|--- .storybook
|--- public
|--- ...
But each project deployment link is independent.
https://localhost:3000/packages-1
https://localhost:3000/packages-2
https://localhost:3000/packages-3
Storybook provides ref attribute, which allows us to compose them together, and access them via an address.
https://localhost:3000/overview
|- https://localhost:3000/packages-1
|- https://localhost:3000/packages-2
|- https://localhost:3000/packages-3
But it's not easy to compose them together. We need to modify a lot of packaging configurations, and create a package for this, and these configurations only need to be used when building overview. It's too complicated, so that's where this tool comes in, and it can do it all in one command.
The chromatic tool was officially recommended, and it made it easy for us to do this, but we couldn't use it to complete the build and privatize the deployment.
npm i bookcase-builder -D
// package.json
{
"bookcase-builder": {
/*
* [ 📌 Required ]
* Where to find Packages.
*/
"workspaces": [
"packages/*"
],
/*
* [ 📌 Required ]
* Directory where to store built files.
*/
"output": "./public",
/*
* Rename the current package name, default to package directory name.
* e.g.
* [root]/packages/packageA => http://localhost:3000/packageA
* Set basename to "packageB", it will be http://localhost:3000/packageB
*/
"basename": "packageB",
/*
* Basename of URL.
* e.g.
* [root]/packages/packageA => http://localhost:3000/packageA
* Set publicURL to "/PREFIX_URL/", it will be http://localhost:3000/PREFIX_URL/packageA
*/
"publicURL": "/PREFIX_URL/",
/*
* [ 📌 Required ]
* Which package manager is used.
* 'yarn' | 'npm' | 'pnpm'
*/
"packageManager": "yarn",
"storybook": {
// Storybook directory, default to ".storybook"
"configDir": "./.otherStorybookDir"
}
}
}
// package.json of package root directory.
{
"bookcase-builder": {
"workspaces": [
// Tell BB where to find the packages to be built
"packages/*"
],
// Let BB where to store the built files
"output": "./public",
// What package manager is used.
"packageManager": "pnpm"
}
}
// package.json in the workspace directory.
// Here you can configure the project to be built. For example specify the storybook configuration directory.
// If you want to use the default configuration, you can set it to "{}". And if haven't configured it, BB will't build it.
{
"bookcase-builder": {
// Rename the current package name, default to package directory name.
"basename": "other name",
"storybook": {
// Storybook configuration directory, default to ".storybook"
"configDir": "./.otherStorybookDir"
}
}
}
// .storybook/main.[js/ts] of the project to be built in the workspace.
import { withOverview } from 'bookcase-builder';
// Let BB know where to find the project to be built, And send original config to the withOverview function.
export default withOverview(__dirname)({
// Original config.
...,
});
$ bookcase-builder or bb
$ bb --help
FAQs
![logo](./assets/cover.png)
The npm package bookcase-builder receives a total of 27 weekly downloads. As such, bookcase-builder popularity was classified as not popular.
We found that bookcase-builder demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer 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.
Product
Streamline your login process and enhance security by enabling Single Sign-On (SSO) on the Socket platform, now available for all customers on the Enterprise plan, supporting 20+ identity providers.
Security News
Tea.xyz, a crypto project aimed at rewarding open source contributions, is once again facing backlash due to an influx of spam packages flooding public package registries.
Security News
As cyber threats become more autonomous, AI-powered defenses are crucial for businesses to stay ahead of attackers who can exploit software vulnerabilities at scale.