Flowershow 开源项目使用教程
flowershow💐 Publish your obsidian digital garden or any markdown site easily and elegantly.项目地址:https://gitcode.com/gh_mirrors/fl/flowershow
1、项目的目录结构及介绍
Flowershow 项目的目录结构如下:
flowershow/
├── components/
├── config/
├── content/
├── layouts/
├── lib/
├── pages/
├── public/_flowershow/
├── scripts/
├── styles/
├── .eslintrc.json
├── .gitattributes
├── .gitignore
├── .prettierignore
├── CHANGELOG.md
├── LICENSE
├── README.md
├── next-env.d.ts
├── next.config.mjs
├── package-lock.json
├── package.json
├── postcss.config.js
└── tailwind.config.js
目录介绍:
components/
: 存放 React 组件。config/
: 存放项目的配置文件。content/
: 存放 Markdown 内容文件。layouts/
: 存放页面布局文件。lib/
: 存放库文件。pages/
: 存放 Next.js 页面文件。public/_flowershow/
: 存放公共资源文件。scripts/
: 存放脚本文件。styles/
: 存放样式文件。.eslintrc.json
: ESLint 配置文件。.gitattributes
: Git 属性配置文件。.gitignore
: Git 忽略文件配置。.prettierignore
: Prettier 忽略文件配置。CHANGELOG.md
: 项目更新日志。LICENSE
: 项目许可证。README.md
: 项目说明文档。next-env.d.ts
: Next.js 环境类型定义文件。next.config.mjs
: Next.js 配置文件。package-lock.json
: npm 依赖锁定文件。package.json
: 项目依赖和脚本配置文件。postcss.config.js
: PostCSS 配置文件。tailwind.config.js
: Tailwind CSS 配置文件。
2、项目的启动文件介绍
项目的启动文件主要是 package.json
中的脚本配置:
{
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
}
}
启动命令:
npm run dev
: 启动开发服务器。npm run build
: 构建生产环境版本。npm run start
: 启动生产环境服务器。npm run lint
: 运行 ESLint 进行代码检查。
3、项目的配置文件介绍
next.config.mjs
Next.js 的配置文件,用于配置 Next.js 应用的各种选项:
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
swcMinify: true,
};
export default nextConfig;
tailwind.config.js
Tailwind CSS 的配置文件,用于自定义 Tailwind CSS 的配置:
module.exports = {
content: [
'./pages/**/*.{js,ts,jsx,tsx}',
'./components/**/*.{js,ts,jsx,tsx}',
],
theme: {
extend: {},
},
plugins: [],
};
postcss.config.js
PostCSS 的配置文件,用于配置 PostCSS 插件:
module.exports = {
plugins: {
tailwindcss: {},
autoprefixer: {},
},
};
.eslintrc.json
ESLint 的配置文件,用于配置代码检查规则:
{
"parserOptions": {
"ecmaVersion": 2020,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true
}
},
"extends": [
"next/core-web-vitals",
"eslint:recommended",
"plugin:react/recommended"
],
"rules": {
"react/react-in-jsx-scope": "off"
}
}
flowershow💐 Publish your obsidian digital garden or any markdown site easily and elegantly.项目地址:https://gitcode.com/gh_mirrors/fl/flowershow