@radishon/lumina 1.0.2 → 1.0.3
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 +59 -0
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -50,6 +50,44 @@ function App() {
|
|
|
50
50
|
|
|
51
51
|
### Vue 3
|
|
52
52
|
|
|
53
|
+
**重要配置**：需要在 `vite.config.js` 或 `vue.config.js` 中配置 `isCustomElement` 来禁用 Vue 对 Web Component 的解析：
|
|
54
|
+
|
|
55
|
+
#### Vite 项目
|
|
56
|
+
|
|
57
|
+
```js
|
|
58
|
+
// vite.config.js
|
|
59
|
+
export default {
|
|
60
|
+
vue: {
|
|
61
|
+
template: {
|
|
62
|
+
compilerOptions: {
|
|
63
|
+
isCustomElement: tag => tag === 'lumina-loading'
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
#### Vue CLI 项目
|
|
71
|
+
|
|
72
|
+
```js
|
|
73
|
+
// vue.config.js
|
|
74
|
+
module.exports = {
|
|
75
|
+
chainWebpack: config => {
|
|
76
|
+
config.module
|
|
77
|
+
.rule('vue')
|
|
78
|
+
.use('vue-loader')
|
|
79
|
+
.tap(options => ({
|
|
80
|
+
...options,
|
|
81
|
+
compilerOptions: {
|
|
82
|
+
isCustomElement: tag => tag === 'lumina-loading'
|
|
83
|
+
}
|
|
84
|
+
}))
|
|
85
|
+
}
|
|
86
|
+
}
|
|
87
|
+
```
|
|
88
|
+
|
|
89
|
+
**使用示例**：
|
|
90
|
+
|
|
53
91
|
```vue
|
|
54
92
|
<template>
|
|
55
93
|
<div class="loading-container">
|
|
@@ -64,6 +102,27 @@ import '@radishon/lumina'
|
|
|
64
102
|
|
|
65
103
|
### Vue 2
|
|
66
104
|
|
|
105
|
+
**重要配置**：需要在 `vue.config.js` 中配置 `isCustomElement`：
|
|
106
|
+
|
|
107
|
+
```js
|
|
108
|
+
// vue.config.js
|
|
109
|
+
module.exports = {
|
|
110
|
+
chainWebpack: config => {
|
|
111
|
+
config.module
|
|
112
|
+
.rule('vue')
|
|
113
|
+
.use('vue-loader')
|
|
114
|
+
.tap(options => ({
|
|
115
|
+
...options,
|
|
116
|
+
compilerOptions: {
|
|
117
|
+
isCustomElement: tag => tag === 'lumina-loading'
|
|
118
|
+
}
|
|
119
|
+
}))
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
```
|
|
123
|
+
|
|
124
|
+
**使用示例**：
|
|
125
|
+
|
|
67
126
|
```vue
|
|
68
127
|
<template>
|
|
69
128
|
<div class="loading-container">
|