vane-waterfall 1.0.3 → 1.0.5
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 +11 -11
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -111,7 +111,7 @@ import {
|
|
|
111
111
|
withPlugins,
|
|
112
112
|
createAlignmentPlugin,
|
|
113
113
|
createTransitionPlugin,
|
|
114
|
-
} from "vane-
|
|
114
|
+
} from "vane-waterfall";
|
|
115
115
|
|
|
116
116
|
const Waterfall = withPlugins(WaterfallCore, [
|
|
117
117
|
createAlignmentPlugin({ mode: "shortest" }),
|
|
@@ -123,7 +123,7 @@ const Waterfall = withPlugins(WaterfallCore, [
|
|
|
123
123
|
|
|
124
124
|
```tsx
|
|
125
125
|
// ❌ 不推荐:一次性导入所有插件(会失去 Tree-Shaking 优势)
|
|
126
|
-
import * as Waterfall from "vane-
|
|
126
|
+
import * as Waterfall from "vane-waterfall";
|
|
127
127
|
```
|
|
128
128
|
|
|
129
129
|
### 按需导入示例
|
|
@@ -131,7 +131,7 @@ import * as Waterfall from "vane-lazy";
|
|
|
131
131
|
#### 方式一:精确导入(最小体积)
|
|
132
132
|
|
|
133
133
|
```tsx
|
|
134
|
-
import { WaterfallCore, withPlugins, createAlignmentPlugin, createTransitionPlugin } from "vane-
|
|
134
|
+
import { WaterfallCore, withPlugins, createAlignmentPlugin, createTransitionPlugin } from "vane-waterfall";
|
|
135
135
|
```
|
|
136
136
|
|
|
137
137
|
#### 方式二:分类导入(推荐)
|
|
@@ -142,7 +142,7 @@ import {
|
|
|
142
142
|
withPlugins,
|
|
143
143
|
createAutoColumnPlugin,
|
|
144
144
|
createResponsiveColumnsPlugin,
|
|
145
|
-
} from "vane-
|
|
145
|
+
} from "vane-waterfall";
|
|
146
146
|
```
|
|
147
147
|
|
|
148
148
|
#### 方式三:分组导入
|
|
@@ -152,7 +152,7 @@ import {
|
|
|
152
152
|
createAlignmentPlugin,
|
|
153
153
|
createFixedHeightPlugin,
|
|
154
154
|
createGapPlugin,
|
|
155
|
-
} from "vane-
|
|
155
|
+
} from "vane-waterfall";
|
|
156
156
|
```
|
|
157
157
|
|
|
158
158
|
### 不同场景的包大小对比(示意)
|
|
@@ -172,7 +172,7 @@ import {
|
|
|
172
172
|
const Waterfall = withPlugins(WaterfallCore, [createTransitionPlugin()]);
|
|
173
173
|
|
|
174
174
|
async function loadAdvancedPlugins() {
|
|
175
|
-
const { createVirtualWaterfallPlugin } = await import("vane-
|
|
175
|
+
const { createVirtualWaterfallPlugin } = await import("vane-waterfall");
|
|
176
176
|
return [createVirtualWaterfallPlugin()];
|
|
177
177
|
}
|
|
178
178
|
```
|
|
@@ -186,7 +186,7 @@ export default {
|
|
|
186
186
|
rollupOptions: {
|
|
187
187
|
output: {
|
|
188
188
|
manualChunks: {
|
|
189
|
-
waterfall: ["vane-
|
|
189
|
+
waterfall: ["vane-waterfall"],
|
|
190
190
|
},
|
|
191
191
|
},
|
|
192
192
|
},
|
|
@@ -204,8 +204,8 @@ module.exports = {
|
|
|
204
204
|
splitChunks: {
|
|
205
205
|
cacheGroups: {
|
|
206
206
|
waterfall: {
|
|
207
|
-
test: /vane-
|
|
208
|
-
name: "vane-
|
|
207
|
+
test: /vane-waterfall/,
|
|
208
|
+
name: "vane-waterfall",
|
|
209
209
|
chunks: "all",
|
|
210
210
|
},
|
|
211
211
|
},
|
|
@@ -229,7 +229,7 @@ module.exports = {
|
|
|
229
229
|
### 基础使用
|
|
230
230
|
|
|
231
231
|
```tsx
|
|
232
|
-
import { WaterfallCore } from "vane-
|
|
232
|
+
import { WaterfallCore } from "vane-waterfall";
|
|
233
233
|
|
|
234
234
|
<WaterfallCore
|
|
235
235
|
items={items}
|
|
@@ -249,7 +249,7 @@ import {
|
|
|
249
249
|
createAutoColumnPlugin,
|
|
250
250
|
createResponsiveColumnsPlugin,
|
|
251
251
|
createTransitionPlugin,
|
|
252
|
-
} from "vane-
|
|
252
|
+
} from "vane-waterfall";
|
|
253
253
|
|
|
254
254
|
const Waterfall = withPlugins(WaterfallCore, [
|
|
255
255
|
createAutoColumnPlugin({ minColumnWidth: 220 }),
|