Skip to content

Commit 49f44c4

Browse files
HowardzhangdqsHowardzhangdqs
committed
feat: cli
1 parent 2db10a6 commit 49f44c4

File tree

10 files changed

+170
-10
lines changed

10 files changed

+170
-10
lines changed

‎cli-dev.sh‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
#!/bin/bash
2+
3+
# 初始化变量
4+
CONTENT_FILE=""
5+
STYLE_FILE=""
6+
7+
# 解析命令行参数
8+
while [[ $# -gt 0 ]]; do
9+
case $1 in
10+
--content|-c)
11+
CONTENT_FILE="$2"
12+
shift 2
13+
;;
14+
--style|-s)
15+
STYLE_FILE="$2"
16+
shift 2
17+
;;
18+
*)
19+
echo "未知参数: $1"
20+
exit 1
21+
;;
22+
esac
23+
done
24+
25+
# 检查是否提供了必要的文件
26+
if [[ -z "$CONTENT_FILE" ]]; then
27+
echo "错误: 未指定内容文件。使用 --content 或 -c 参数指定。"
28+
exit 1
29+
fi
30+
31+
if [[ -z "$STYLE_FILE" ]]; then
32+
echo "错误: 未指定样式文件。使用 --style 或 -s 参数指定。"
33+
exit 1
34+
fi
35+
36+
# 检查文件是否存在
37+
if [[ ! -f "$CONTENT_FILE" ]]; then
38+
echo "错误: 内容文件 '$CONTENT_FILE' 不存在。"
39+
exit 1
40+
fi
41+
42+
if [[ ! -f "$STYLE_FILE" ]]; then
43+
echo "错误: 样式文件 '$STYLE_FILE' 不存在。"
44+
exit 1
45+
fi
46+
47+
# 读取文件内容到环境变量
48+
export VITE_JIMI_CONTENT=$(cat "$CONTENT_FILE")
49+
export VITE_JIMI_STYLE=$(cat "$STYLE_FILE")
50+
export VITE_SINGLE_FILE_RENDER=True
51+
52+
# 显示确认信息
53+
echo "已设置环境变量:"
54+
echo "- VITE_JIMI_CONTENT: 从文件 '$CONTENT_FILE' 读取"
55+
echo "- VITE_JIMI_STYLE: 从文件 '$STYLE_FILE' 读取"
56+
57+
# 运行构建命令
58+
echo "正在运行 pnpm dev..."
59+
pnpm dev

‎cli.sh‎

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
#!/bin/bash
2+
3+
# 初始化变量
4+
CONTENT_FILE=""
5+
STYLE_FILE=""
6+
7+
# 解析命令行参数
8+
while [[ $# -gt 0 ]]; do
9+
case $1 in
10+
--content|-c)
11+
CONTENT_FILE="$2"
12+
shift 2
13+
;;
14+
--style|-s)
15+
STYLE_FILE="$2"
16+
shift 2
17+
;;
18+
*)
19+
echo "未知参数: $1"
20+
exit 1
21+
;;
22+
esac
23+
done
24+
25+
# 检查是否提供了必要的文件
26+
if [[ -z "$CONTENT_FILE" ]]; then
27+
echo "错误: 未指定内容文件。使用 --content 或 -c 参数指定。"
28+
exit 1
29+
fi
30+
31+
if [[ -z "$STYLE_FILE" ]]; then
32+
echo "错误: 未指定样式文件。使用 --style 或 -s 参数指定。"
33+
exit 1
34+
fi
35+
36+
# 检查文件是否存在
37+
if [[ ! -f "$CONTENT_FILE" ]]; then
38+
echo "错误: 内容文件 '$CONTENT_FILE' 不存在。"
39+
exit 1
40+
fi
41+
42+
if [[ ! -f "$STYLE_FILE" ]]; then
43+
echo "错误: 样式文件 '$STYLE_FILE' 不存在。"
44+
exit 1
45+
fi
46+
47+
# 读取文件内容到环境变量
48+
export VITE_JIMI_CONTENT=$(cat "$CONTENT_FILE")
49+
export VITE_JIMI_STYLE=$(cat "$STYLE_FILE")
50+
export VITE_SINGLE_FILE_RENDER=True
51+
52+
# 显示确认信息
53+
echo "已设置环境变量:"
54+
echo "- VITE_JIMI_CONTENT: 从文件 '$CONTENT_FILE' 读取"
55+
echo "- VITE_JIMI_STYLE: 从文件 '$STYLE_FILE' 读取"
56+
57+
# 运行构建命令
58+
echo "正在运行 pnpm build..."
59+
pnpm build

‎example/content1.md‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
# 这是测试文件
2+
3+
## 这是二级标题
4+
5+
这是一段文字，这里**加粗**了，这里*倾斜*了，这里是***加粗斜体***，这里增加了<u>下划线</u>。
6+
7+
1. 没病走两步
8+
2. 走出一个一日千里
9+
10+
+ 走出一个虎虎生风
11+
+ 走出个恍如隔世

‎example/style1.jcss‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/* 通过宏直接引入你需要的格式包 */
2+
@import(default, weekly)
3+
4+
/* 这里你可以自定义CSS */
5+
.md .custom {
6+
background: linear-gradient(217deg, rgba(255, 0, 0, .8), rgba(255, 0, 0, 0) 70.71%),
7+
linear-gradient(127deg, rgba(0, 255, 0, .8), rgba(0, 255, 0, 0) 70.71%),
8+
linear-gradient(336deg, rgba(0, 0, 255, .8), rgba(0, 0, 255, 0) 70.71%);
9+
color: linear-gradient(170deg, blue, pink);
10+
width: max-content
11+
}

‎package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -17,6 +17,7 @@
1717
"markdown-it": "^14.1.0",
1818
"markdown-it-mathjax3": "^4.3.2",
1919
"marked": "^15.0.6",
20+
"vite-plugin-singlefile": "^2.1.0",
2021
"vue": "^3.5.13"
2122
},
2223
"devDependencies": {

‎src/App.vue‎

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -2,12 +2,14 @@
22
import Input from "./components/Input.vue";
33
import Display from "./components/Display.vue";
44
import CSSEditor from "./components/CSSEditor.vue";
5+
6+
const VITE_SINGLE_FILE_RENDER = import.meta.env.VITE_SINGLE_FILE_RENDER == "True";
57
</script>
68

79
<template>
810
<div class="container">
911
<!-- Edit Panel -->
10-
<div class="flex">
12+
<div class="flex" v-show="!VITE_SINGLE_FILE_RENDER">
1113
<Input />
1214
<hr />
1315
<CSSEditor />
@@ -25,21 +27,21 @@ import CSSEditor from "./components/CSSEditor.vue";
2527
display: flex;
2628
justify-content: space-between;
2729
gap: calc(var(--global-padding) * 1);
28-
padding: var(--global-padding);
29-
height: calc(100vh - var(--global-padding) * 2);
30+
padding: v-bind('VITE_SINGLE_FILE_RENDER ? "none" : "var(--global-padding)"');
31+
height: v-bind('VITE_SINGLE_FILE_RENDER ? "100vh" : "calc(100vh - var(--global-padding) * 2)"');
3032
}
3133
3234
.flex {
3335
flex: 1;
34-
border: 1px solid #0003;
35-
border-radius: calc(var(--global-padding) * 1.5);
36+
border: v-bind('VITE_SINGLE_FILE_RENDER ? "none" : "1px solid #0003"');
37+
border-radius: v-bind('VITE_SINGLE_FILE_RENDER ? "none" : "calc(var(--global-padding) * 1.5)"');
3638
height: 100%;
3739
transition: all 0.3s;
3840
box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
3941
}
4042
4143
.flex:hover {
42-
border-color: #0005;
43-
box-shadow: 0 0 30px #0002;
44+
border-color: v-bind('VITE_SINGLE_FILE_RENDER ? "none" : "#0005"');
45+
box-shadow: v-bind('VITE_SINGLE_FILE_RENDER ? "none" : "0 0 30px #0002"');
4446
}
4547
</style>

‎src/components/Display.vue‎

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<template>
2-
<button @click="selectContent" class="btn" :style="{ color: display_copy_success ? 'rgb(0, 146, 0)' : 'black' }">
2+
<button @click="selectContent" class="btn" v-show="!VITE_SINGLE_FILE_RENDER"
3+
:style="{ color: display_copy_success ? 'rgb(0, 146, 0)' : 'black' }">
34
{{ display_copy_success ? "复制成功" : "一键复制" }}
45
</button>
56
<div v-html="parsed_markdown" class="markdown md"></div>
@@ -15,6 +16,8 @@ import hljs from "highlight.js";
1516
import "highlight.js/styles/github-dark.min.css";
1617
import { computed, ref, watchEffect } from "vue";
1718
19+
const VITE_SINGLE_FILE_RENDER = import.meta.env.VITE_SINGLE_FILE_RENDER == "True";
20+
1821
const md = markdownit({
1922
html: true,
2023
highlight: (str, lang) => {

‎src/content.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import { ref } from "vue";
22

3-
const content = ref<string>(`# 这是大标题
3+
const content = ref<string>(import.meta.env.VITE_JIMI_CONTENT ? import.meta.env.VITE_JIMI_CONTENT : `# 这是大标题
44
55
## 这是二级标题
66
@@ -67,7 +67,7 @@ export const content_cursor_position = ref<number>(0);
6767

6868
export const image_bed = new Map();
6969

70-
export const user_css = ref<string>(`/* 通过宏直接引入你需要的格式包 */
70+
export const user_css = ref<string>(import.meta.env.VITE_JIMI_STYLE ? import.meta.env.VITE_JIMI_STYLE : `/* 通过宏直接引入你需要的格式包 */
7171
@import(default, weekly)
7272
7373
/* 这里你可以自定义CSS */

‎src/vite-env.d.ts‎

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
/// <reference types="vite/client" />
2+
3+
interface ImportMetaEnv {
4+
readonly VITE_JIMI_CONTENT: string
5+
readonly VITE_JIMI_STYLE: string
6+
readonly VITE_SINGLE_FILE_RENDER: string
7+
}
8+
9+
interface ImportMeta {
10+
readonly env: ImportMetaEnv
11+
}

‎vite.config.ts‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,13 +4,16 @@ import { defineConfig } from "vite";
44
import vue from "@vitejs/plugin-vue";
55
import vueJsx from "@vitejs/plugin-vue-jsx";
66
import vueDevTools from "vite-plugin-vue-devtools";
7+
import { viteSingleFile } from "vite-plugin-singlefile";
8+
import process from "node:process";
79

810
// https://vite.dev/config/
911
export default defineConfig({
1012
plugins: [
1113
vue(),
1214
vueJsx(),
1315
vueDevTools(),
16+
process.env.VITE_SINGLE_FILE_RENDER === "True" ? viteSingleFile() : null,
1417
],
1518
resolve: {
1619
alias: {

0 commit comments

Comments
 (0)