@darkchest/wck 0.0.5 → 0.0.8
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/package.json +1 -1
- package/readme.md +27 -15
package/package.json
CHANGED
package/readme.md
CHANGED
|
@@ -48,13 +48,34 @@
|
|
|
48
48
|
|
|
49
49
|
## 🛠️ 安装与配置
|
|
50
50
|
|
|
51
|
-
### 1.
|
|
51
|
+
### 1. 使用示例(重要: 请参考TodoList.vue文件示例, 该文件中已包含所有核心功能并且开箱即用)
|
|
52
52
|
|
|
53
|
+
```javascript
|
|
54
|
+
// 创建一个项目文件夹, 例如helloworld, 然后在文件夹中执行npm init -y初始化一下.
|
|
55
|
+
// 然后我们在文件夹中手动创建vite.config.js, index.html, src/index.js, src/components/TodoList.vue文件
|
|
56
|
+
// 以上文件的内容直接复制下面对应的内容即可.(注意package.json不能复制, 而是手动修改scripts命令的部分, 请看下面的package.json部分)
|
|
57
|
+
```
|
|
58
|
+
|
|
59
|
+
### 2. 安装依赖(在刚刚创建的helloworld文件夹中执行以下命令安装依赖)
|
|
53
60
|
```bash
|
|
54
61
|
npm install @darkchest/wck vite -D
|
|
55
62
|
```
|
|
56
63
|
|
|
57
|
-
###
|
|
64
|
+
### 3. 在package.json中手动配置命令
|
|
65
|
+
```json
|
|
66
|
+
// package.json
|
|
67
|
+
// 主要是增加dev/build俩个命令来启动vite开发和打包.
|
|
68
|
+
{
|
|
69
|
+
...,
|
|
70
|
+
"scripts": {
|
|
71
|
+
"dev": "vite",
|
|
72
|
+
"build": "vite build"
|
|
73
|
+
},
|
|
74
|
+
...,
|
|
75
|
+
}
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
### 4. 复制下面的文件内容到项目目录对应的文件中
|
|
58
79
|
```javascript
|
|
59
80
|
// vite.config.js
|
|
60
81
|
import { defineConfig } from 'vite';
|
|
@@ -76,19 +97,6 @@ export default defineConfig({
|
|
|
76
97
|
})
|
|
77
98
|
```
|
|
78
99
|
|
|
79
|
-
```json
|
|
80
|
-
// package.json
|
|
81
|
-
// 主要是增加dev/build俩个命令来启动vite开发和打包.
|
|
82
|
-
{
|
|
83
|
-
...,
|
|
84
|
-
"scripts": {
|
|
85
|
-
"dev": "vite",
|
|
86
|
-
"build": "vite build"
|
|
87
|
-
},
|
|
88
|
-
...,
|
|
89
|
-
}
|
|
90
|
-
```
|
|
91
|
-
|
|
92
100
|
```javascript
|
|
93
101
|
// src/index.js
|
|
94
102
|
import TodoList from './components/TodoList.vue';
|
|
@@ -788,6 +796,10 @@ footer {
|
|
|
788
796
|
</html>
|
|
789
797
|
```
|
|
790
798
|
|
|
799
|
+
### 5. 运行项目
|
|
800
|
+
- 如果执行npm run dev, 浏览器打开index.html并运行在localhost下, 此时请参考上面的说明使用import './src/index.js'的方式引入src/index.js.
|
|
801
|
+
- 如果运行npm run build, 则会使用vite打包文件到dist目录下的index.iife.min.js, 然后我们手动在index.html中通过script的src属性引入这个打包后的文件, 最后双击index.html打开网页即可.
|
|
802
|
+
|
|
791
803
|
|
|
792
804
|
## 最后的最后
|
|
793
805
|
|