@snack-kit/scripts 0.4.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.
- package/README.md +103 -39
- package/package.json +1 -1
- package/template/dev/App.tsx +5 -10
- 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
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
"
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
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
|
-
|
|
123
|
-
|
|
182
|
+
// 修改 webpack 配置
|
|
183
|
+
return config;
|
|
124
184
|
};
|
|
125
185
|
```
|
|
126
186
|
|
|
@@ -142,6 +202,10 @@ module.exports = (config) => {
|
|
|
142
202
|
|
|
143
203
|
## Changelog
|
|
144
204
|
|
|
205
|
+
### 0.5.0
|
|
206
|
+
|
|
207
|
+
- 修复:默认渲染高度的问题
|
|
208
|
+
|
|
145
209
|
### 0.4.0
|
|
146
210
|
|
|
147
211
|
- 修复:调试窗口 topbar 工具区样式细节优化
|
package/package.json
CHANGED
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
|
|
414
|
+
const innerStyle: React.CSSProperties = {};
|
|
415
415
|
if (width) {
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
style.flexShrink = 0;
|
|
416
|
+
innerStyle.width = width;
|
|
417
|
+
innerStyle.margin = '0 auto';
|
|
419
418
|
}
|
|
420
419
|
if (scale !== 100) {
|
|
421
|
-
|
|
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={
|
|
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); }
|