当前位置:网站首页>使用npx -p @storybook/cli sb init安装失败,手把手搭建专属的storybook
使用npx -p @storybook/cli sb init安装失败,手把手搭建专属的storybook
2022-08-02 14:09:00 【N.S.N】
1.全局安装Storybook
npm i -g storybook
2.执行以下命令安装@storybook/react
npm i --save-dev @storybook/react
3.在package.json文件中
{
"scripts": {
"storybook": "start-storybook -p 9009 -s public",
"build-storybook": "build-storybook -s public"
}
4.在工程根目录创建.storybook目录
5.在.storybook目录下创建config.js文件
import {
configure, addDecorator } from '@storybook/react';
configure(require.context('../src', true, /\.stories\.tsx$/), module)
6.自己创建以.stories.js结尾的文件
7.需要集成typescrip,则创建webpack.config.js文件在.storybook文件夹里
module.exports = ({
config }) => {
config.module.rules.push({
test: /\.tsx?$/,
use: [
{
loader: require.resolve("babel-loader"),
options: {
presets: [require.resolve("babel-preset-react-app")]
}
}
]
});
config.resolve.extensions.push(".ts", ".tsx");
return config;
};
8.安装其他依赖
cnpm i @storybook/addon-actions @storybook/addon-links @storybook/addons -D
[email protected]/preset-create-react-app用来代表您配置Storybook。这是由Storybook在自动设置(Storybook 5.3或更高版本)期间安装的。
cnpm i --save-dev @storybook/preset-create-react-app
边栏推荐
猜你喜欢
PyTorch⑨---卷积神经网络_线性层
记录Yolo-tiny-v4的权重提取和中间层结果提取
ARMv8虚拟化
NDK报错问题分析方案(一)
It is not allowed to subscribe with a(n) xxx multiple times.Please create a fresh instance of xxx
FP7122降压恒流内置MOS耐压100V共正极阳极PWM调光方案原理图
内存申请(malloc)和释放(free)之上篇
拥抱Jetpack之印象篇
小T成长记-网络篇-1-什么是网络?
The problem that UIWindow's makeKeyAndVisible does not call viewDidLoad of rootviewController
随机推荐
最小树高度
DP4301无线收发SUB-1G芯片兼容CC1101智能家居
vscode编译keil工程,烧录程序
DP4056电源保护芯片锂电池pin对pinTP4056
The NDK portal: C
DP1332E内置c8051的mcu内核NFC刷卡芯片国产兼容NXP
define #使用
执行npm install有错误error
Pytorch(16)---搭建一个完整的模型
文本匹配任务
Tensorflow常用函数
The overlapping effect of the two surfaceviews is similar to the video and handout practice in the live effect
boost库智能指针
牛客刷题汇总(持续更新中)
ConstraintLayout从入门到放弃
PyTorch(15)---模型保存和加载
LLVM系列第十章:控制流语句if-else-phi
可以拖拽的ViewGroup,仿微信拖拽缩放关闭
VS2017中安装visual assist X插件
The Handler you really understand?