Nextjs-TailwindCSS-Storybook-TypeScript前端架构模板
nextjs 的项目起点里,nextjs-tailwindcss-storybook-typescript算是挺顺手的一个。带TypeScript,集成了TailwindCSS、Storybook,开箱即用,适合想快速搭好前端架构的你。
Tailwind 在storybook
里是单独构建的,用了tailwind-storybook
脚本,路径、输出都设置好了,基本不用你操心。想改的话,直接看看package.json
里的命令就行。
项目结构比较干净,不花哨,写组件、调样式都挺顺。tailwind.css
放在./styles
,Storybook 专用样式会被构建到./public/storybook
,结构清晰,调试也方便。
我觉得这个模板比较适合那些已经用过一轮 Next 的人。比如你现在想拉个中大型项目,又不想从零搭,那这个可以省不少配置时间。
注意一点,如果你 Storybook 里还想引其他自定义插件,最好提前看下它的 Webpack 配置,虽然不复杂,但动起来还是得小心点。
如果你是想做组件库的开发,又想保持样式一致,Storybook + Tailwind 的搭配真的香,调起来也快,展示也统一。
nextjs-tailwindcss-storybook-typescript-main.zip
预估大小:22个文件
nextjs-tailwindcss-storybook-typescript-main
文件夹
.storybook
文件夹
preview.js
74B
preview-head.html
151B
main.js
249B
package.json
1KB
package-lock.json
642KB
pages
文件夹
_app.tsx
207B
index.tsx
906B
489.43KB
文件大小:
评论区