@snack-kit/scripts 0.3.0 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/README.md +109 -39
  2. package/config/webpack.shared.js +11 -1
  3. package/package.json +2 -2
  4. package/template/dev/App.tsx +5 -10
  5. package/template/dev/index.scss +7 -0
package/README.md CHANGED
@@ -10,13 +10,13 @@ npm install @snack-kit/scripts --save-dev
10
10
 
11
11
  ## 命令
12
12
 
13
- | 命令 | 说明 |
14
- |------|------|
13
+ | 命令 | 说明 |
14
+ |----------------------------|---------------|
15
15
  | `snack-scripts init [dir]` | 初始化新 snack 工程 |
16
- | `snack-scripts create` | 在当前工程创建新模块模版 |
17
- | `snack-scripts start` | 启动开发调试服务 |
18
- | `snack-scripts build` | 生产模式打包 |
19
- | `snack-scripts entry` | 打包独立入口页面 |
16
+ | `snack-scripts create` | 在当前工程创建新模块模版 |
17
+ | `snack-scripts start` | 启动开发调试服务 |
18
+ | `snack-scripts build` | 生产模式打包 |
19
+ | `snack-scripts entry` | 打包独立入口页面 |
20
20
 
21
21
  ### init — 初始化工程
22
22
 
@@ -31,6 +31,7 @@ snack-scripts init my-project
31
31
  交互式提问：项目名、描述、作者、调试服务地址、入口页面 id/type。
32
32
 
33
33
  生成文件：
34
+
34
35
  ```
35
36
  my-project/
36
37
  ├── package.json
@@ -52,6 +53,7 @@ snack-scripts create
52
53
  交互式提问：模块中文名、目录名（PascalCase）、描述、作者、是否生成 setting 模块。
53
54
 
54
55
  生成文件（以 `UserManager` 为例）：
56
+
55
57
  ```
56
58
  src/package/UserManager/
57
59
  ├── snack.json
@@ -78,38 +80,96 @@ src/package/UserManager/
78
80
 
79
81
  ```js
80
82
  {
81
- "input": "./src/package", // snack 模块目录，默认 "src/package"
82
- "output": "./dist", // 生产输出目录，默认 "dist"
83
- "snack": {
84
- "externals": {}, // 同 webpack externals，过滤不打包的依赖
85
- "buildIgnore": [], // 生产打包忽略的模块（模块目录名）
86
- "devPackage": [], // 开发模式仅启动指定模块（模块目录名），空数组表示全部启动
87
- "entry": { // 独立入口页面配置（snack-scripts entry 命令使用）
88
- "name": "entry", // 输出目录名，默认 "entry"
89
- "id": "my_page", // 所加载的页面 id
90
- "type": "portal", // 所加载的页面分类（可选）
91
- "title": "My App", // HTML 页面 title（可选）
92
- "favicon": "./favicon.ico", // 浏览器角标路径，相对项目根路径（可选）
93
- "service": "", // snackbar 服务端地址，默认使用当前地址栏（可选）
94
- "devServer": "", // 调试服务网关（可选）
95
- "mobile": { // 移动端页面配置，竖屏或宽度 < 1024px 时加载（可选）
96
- "id": "my_page_mobile",
97
- "type": "portal"
98
- },
99
- "files": [], // 需复制到发布目录的文件或目录路径（可选）
100
- "js": "./plugin.ts", // 外挂打包的 JS/TS 文件路径（可选）
101
- "css": "./plugin.scss", // 外挂打包的 CSS/SCSS 文件路径（可选）
102
- "template": { // 自定义 HTML 模板路径，相对项目根路径（可选）
103
- "index": "./public/index.html",
104
- "dev": "./public/dev.html",
105
- "entry": "./public/entry.html"
106
- }
107
- },
108
- "plugin": { // snack 模块独立 index.html 外挂文件（可选）
109
- "js": "./plugin.ts",
110
- "css": "./plugin.scss"
83
+ "input"
84
+ :
85
+ "./src/package", // snack 模块目录，默认 "src/package"
86
+ "output"
87
+ :
88
+ "./dist", // 生产输出目录，默认 "dist"
89
+ "snack"
90
+ :
91
+ {
92
+ "externals"
93
+ :
94
+ {
95
+ }
96
+ , // 同 webpack externals，过滤不打包的依赖
97
+ "buildIgnore"
98
+ :
99
+ [], // 生产打包忽略的模块（模块目录名）
100
+ "devPackage"
101
+ :
102
+ [], // 开发模式仅启动指定模块（模块目录名），空数组表示全部启动
103
+ "entry"
104
+ :
105
+ { // 独立入口页面配置（snack-scripts entry 命令使用）
106
+ "name"
107
+ :
108
+ "entry", // 输出目录名，默认 "entry"
109
+ "id"
110
+ :
111
+ "my_page", // 所加载的页面 id
112
+ "type"
113
+ :
114
+ "portal", // 所加载的页面分类（可选）
115
+ "title"
116
+ :
117
+ "My App", // HTML 页面 title（可选）
118
+ "favicon"
119
+ :
120
+ "./favicon.ico", // 浏览器角标路径，相对项目根路径（可选）
121
+ "service"
122
+ :
123
+ "", // snackbar 服务端地址，默认使用当前地址栏（可选）
124
+ "devServer"
125
+ :
126
+ "", // 调试服务网关（可选）
127
+ "mobile"
128
+ :
129
+ { // 移动端页面配置，竖屏或宽度 < 1024px 时加载（可选）
130
+ "id"
131
+ :
132
+ "my_page_mobile",
133
+ "type"
134
+ :
135
+ "portal"
136
+ }
137
+ ,
138
+ "files"
139
+ :
140
+ [], // 需复制到发布目录的文件或目录路径（可选）
141
+ "js"
142
+ :
143
+ "./plugin.ts", // 外挂打包的 JS/TS 文件路径（可选）
144
+ "css"
145
+ :
146
+ "./plugin.scss", // 外挂打包的 CSS/SCSS 文件路径（可选）
147
+ "template"
148
+ :
149
+ { // 自定义 HTML 模板路径，相对项目根路径（可选）
150
+ "index"
151
+ :
152
+ "./public/index.html",
153
+ "dev"
154
+ :
155
+ "./public/dev.html",
156
+ "entry"
157
+ :
158
+ "./public/entry.html"
159
+ }
160
+ }
161
+ ,
162
+ "plugin"
163
+ :
164
+ { // snack 模块独立 index.html 外挂文件（可选）
165
+ "js"
166
+ :
167
+ "./plugin.ts",
168
+ "css"
169
+ :
170
+ "./plugin.scss"
171
+ }
111
172
  }
112
- }
113
173
  }
114
174
  ```
115
175
 
@@ -119,8 +179,8 @@ src/package/UserManager/
119
179
 
120
180
  ```js
121
181
  module.exports = (config) => {
122
- // 修改 webpack 配置
123
- return config;
182
+ // 修改 webpack 配置
183
+ return config;
124
184
  };
125
185
  ```
126
186
 
@@ -142,6 +202,16 @@ module.exports = (config) => {
142
202
 
143
203
  ## Changelog
144
204
 
205
+ ### 0.5.0
206
+
207
+ - 修复：默认渲染高度的问题
208
+
209
+ ### 0.4.0
210
+
211
+ - 修复：调试窗口 topbar 工具区样式细节优化
212
+ - 修复：启动调试运行错误的问题
213
+ - 修复：修复 core 依赖版本错误的问题
214
+
145
215
  ### 0.3.0
146
216
 
147
217
  - 新增：调试窗口 topbar 视口尺寸切换（PC / Tablet / Mobile / 自定义），偏好持久化到 localStorage
package/config/webpack.shared.js CHANGED
@@ -89,7 +89,17 @@ function createResolve(extraAlias = {}) {
89
89
  package: path.join(process.env.PROJECT_PATH, 'src/package'),
90
90
  assets: path.join(process.env.PROJECT_PATH, 'src/assets'),
91
91
  // @snack-kit/core 的 package.json module 字段路径有误，直接指向 cjs
92
- '@snack-kit/core': path.resolve(__dirname, '../node_modules/@snack-kit/core/dist/cjs/index.js'),
92
+ // 优先使用宿主项目安装的 @snack-kit/core，fallback 到 scripts 自身的（兼容 file: 软链）
93
+ '@snack-kit/core': (() => {
94
+ const projectCorePath = process.env.PROJECT_PATH
95
+ ? path.join(process.env.PROJECT_PATH, 'node_modules/@snack-kit/core/dist/cjs/index.js')
96
+ : null;
97
+ const scriptsCorePath = path.resolve(__dirname, '../node_modules/@snack-kit/core/dist/cjs/index.js');
98
+ if (projectCorePath) {
99
+ try { require.resolve(projectCorePath); return projectCorePath; } catch (_) {}
100
+ }
101
+ return scriptsCorePath;
102
+ })(),
93
103
  // 优先使用宿主项目自己的 react，保证 React 版本与项目一致（兼容 React 17/18/19）
94
104
  // react/react-dom 使用目录别名（不加 $），使子路径（如 react/jsx-runtime）也走项目自身版本
95
105
  // react-dom/client 比 react-dom 更长，enhanced-resolve 会优先匹配更具体的 key
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@snack-kit/scripts",
3
- "version": "0.3.0",
3
+ "version": "0.5.0",
4
4
  "description": "snack-cli package scripts Powered by Para FED",
5
5
  "bin": {
6
6
  "snack-scripts": "./bin/main.js"
@@ -35,7 +35,7 @@
35
35
  "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
36
36
  "react": "^19.0.0",
37
37
  "react-dom": "^19.0.0",
38
- "@snack-kit/core": "file:../core",
38
+ "@snack-kit/core": "^0.3.0",
39
39
  "@snack-kit/lib": "^0.6.0",
40
40
  "@swc/core": "^1.2.100",
41
41
  "babel-loader": "^9.1.3",
package/template/dev/App.tsx CHANGED
@@ -411,22 +411,17 @@ const RefreshBtn = ({ onRefresh }: any) => (
411
411
  // ─── Pane Content Wrapper ─────────────────────────────────────────────────────
412
412
 
413
413
  const PaneContent = ({ width, scale, bg, children }: any) => {
414
- const style: React.CSSProperties = {};
414
+ const innerStyle: React.CSSProperties = {};
415
415
  if (width) {
416
- style.width = width;
417
- style.margin = '0 auto';
418
- style.flexShrink = 0;
416
+ innerStyle.width = width;
417
+ innerStyle.margin = '0 auto';
419
418
  }
420
419
  if (scale !== 100) {
421
- style.transform = `scale(${scale / 100})`;
422
- style.transformOrigin = 'top left';
423
- if (width) {
424
- style.width = width;
425
- }
420
+ innerStyle.zoom = scale / 100;
426
421
  }
427
422
  return (
428
423
  <div className={`sd-pane__content sd-pane__content--bg-${bg}`}>
429
- <div style={style}>
424
+ <div style={innerStyle}>
430
425
  {children}
431
426
  </div>
432
427
  </div>
package/template/dev/index.scss CHANGED
@@ -743,6 +743,13 @@ button {
743
743
  overflow: auto;
744
744
  padding: 16px;
745
745
  transition: background .2s;
746
+ // 让内部子元素可以用 min-height: 100% 撑满
747
+ display: flex;
748
+ flex-direction: column;
749
+
750
+ & > div {
751
+ flex: 1;
752
+ }
746
753
 
747
754
  // 背景模式
748
755
  &--bg-default { background: var(--bg); }