vue脚手架配置

vue/vue3_Ant框架.md

@@ -30,11 +30,11 @@
 ```
 <!-- tabs:end -->
 
-### 2. `vue3` 中,配置 `ant`
+### 2. `vuecli` 中全局配置 `ant`
 > 全局配置ant
 > 在vue3中全局挂载模块和vue2中有一点区别, 区别不大
 <!-- tabs:start -->
-### **vue3**
+### **vue3方案**
 编辑 `src` 目录下的 `main.js` ,使用 `app.use` 来进行导入,支持链式调用
 ```javascript
 import { createApp } from 'vue';
@@ -47,8 +47,17 @@ app.mount("#app");
 // 也可以按照下面方式进行引用,xxx为模块
 createApp(app).use(xxx).use(xxx).use(Antd)
 ```
-### ***vue2***
-没写,我也不知道
+### **vue2方案**
+
+编辑`src`目录下的`main.js`文件.在创建好的情况下加入下面语句
+```js
+import Antd from 'ant-design-vue'
+import 'ant-design-vue/dist/antd.css'
+Vue.config.productionTip = false
+// 全局注册导入antd.
+Vue.use(Antd)
+```
+
 <!-- tabs:end -->
 ## 递归渲染 `sidebar`
 #### 1. 思路解析

vue/vue脚手架配置.md

@@ -46,46 +46,60 @@ devServer: {
 }
 ```
 + 重新启动服务,可以发现端口已经被修改成了2333
-## 3. 配置mockjs
-> 这一步浪费了挺多时间的,过于傻逼,可能早已经配置好了结果自己写错了路径,导致找了大量资料,方法不一定适用所有的
-  + 引入mockjs
-    > 
-    ```
-    npm install mockjs
-    ```
-  + 创建mockjs
-    > 在src目录下边创建mock文件夹,在mock文件夹中创建index.js 其中写上如下代码
-    ```
-    //导入mockjs
-    import Mock from 'mockjs';
-    // a可以替换成其他的mock文件
-    require('./path/a.js'); 
-    Mock.setup({
-        timeout: 800
-    });    
-    ```
-    > 在mock目录下边创建叫path的目录,里面创建a.js文件,内部写入如下代码
-    ```
-    // 导入mockjs
-    let Mock = require('mockjs');
-    // 创建成一个函数用来返回数据
-    let a = function() {
-        return {
-            abc: 1
-        }
-    }
-    // 第一个参数写正则来匹配路径,第二个参数写上method(get|post),a则为函数,返回一个值
-    Mock.mock(/\/mock\/news/, 'get', a);
-    ```
-    > 可以在服务启动后去访问/api/mock/news文件夹看是否成功配置好了
-  + end
-
-
-## 4. 关闭烦人的变量定义必须使用的错误
+## 3. 关闭烦人的变量定义必须使用的错误
 > 变量生来自由，变量都有权选择是否被使用。为了变量的自由而战   —— 
 + 在根目录的 `package.json` 里面找到 `eslintConfig` ,添加或者找到 `rules` 字段,添加或者设置 `"no-unused-vars":"off"` 即可正常关闭
 + 后续等待更新
-## 5. 全局注册Antd组件
+## 4. 添加插件
+> [!tip]
+> 一些使用vuecli可能经常用到的相关内容
+### 1. 全局注册`Antd`组件
 > [!tip]
 > 可以参考[vue3配置ant](../vue/vue3_Ant框架.md)
+### 2. 添加 `tailwindcss`
+> [!tip]
+> 由于`postcss`和`vuecli`版本有点多,不同版本可能不一样的安装方式
+### 3. 配置封装`vue-router`
+### 4. 配置添加使用`vuex`
+### 5. 添加`axions`
+### 6. 配置`mockjs`
+
++ 引入mockjs
+
+```shell
+npm install mockjs
+```
+
++ 创建mockjs
+> 在src目录下边创建mock文件夹,在mock文件夹中创建index.js 其中写上如下代码
+ 
+```shell
+//导入mockjs
+import Mock from 'mockjs';
+// a可以替换成其他的mock文件
+require('./path/a.js'); 
+Mock.setup({
+    timeout: 800
+});
+```
+
+> 在`mock`目录下边创建叫`path`的目录,里面创建`a.js`文件,内部写入如下代码
+
+```js
+// 导入mockjs
+let Mock = require('mockjs');
+// 创建成一个函数用来返回数据
+let a = function() {
+    return {
+        abc: 1
+    }
+}
+// 第一个参数写正则来匹配路径,第二个参数写上method(get|post),a则为函数,返回一个值
+Mock.mock(/\/mock\/news/, 'get', a);
+```
+
+> 可以在服务启动后去访问/api/mock/news文件夹看是否成功配置好了
++ end
+### 7. 使用`svg`文件
+