服务器一台

思路：

服务器开启http代理，终端使用ssh隧道连接服务器，以达到使用代理服务器的目的。
```bash
sudo apt-get update
sudo apt-get install squid
```
配置Squid代理。编辑Squid配置文件，通常在/etc/squid/squid.conf。根据需要修改配置文件中的参数，例如代理监听的端口号、允许的IP地址等。
以下是一个示例配置：
```bash
http_port 3128
acl localnet src 0.0.0.0/24  # 允许的本地网络段
http_access allow localnet
```
注：云服务器我不知道应该信任哪个ip，所以我直接0.0.0.0
保存并退出配置文件后，重新启动Squid服务：
`sudo systemctl restart squid`
终端设备ssh连接到此服务器：
`ssh -L [本地任意没有占用的端口]:localhost:[服务器squid端口] [服务器账户]@[ip地址]`
`ssh -L 1080:localhost:3128 root@173.82.**.**`
终端设备打开代理
ip输入127.0.0.1
端口填1080（对应端口)

当你使用这个SSH端口转发命令后，本地计算机上的所有发往本地1080端口的网络请求都会被通过SSH隧道转发到远程服务器上，然后再由远程服务器上的localhost:3128上的代理服务处理。这使得你可以在本地计算机上使用远程服务器上的代理服务

使用ssh隧道进行通信

docker swarm将slave转master

1.打开“注册表编辑器”
进入该路径
`HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\VBoxDrv`
2.修改Start 16进制值为2
![image.png](http://www.momen.world:8880/static/img/3ba4ca6b496d5cda5475aee41d5cb12c.image.png)
3.重启电脑即可使用

HCL无法启动--vbox无法正常启动虚拟机

./main.js
```js
import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.config.productionTip = false
    //在vue中使用elementui
Vue.use(ElementUI);
new Vue({
    router,
    store,
    render: h => h(App)
}).$mount('#app')
```
./router/index.js
对路径进行注册

elementui

vue

![截图_microsoft-edge_20230926213027.png](http://www.momen.world:8880/static/img/aad05c08e85c29bbddd27e5e654586fe.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926213027.png)

![截图_microsoft-edge_20230926213110.png](http://www.momen.world:8880/static/img/41690f731e8eccd11715aa4fd91ce33e.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926213110.png)

![截图_microsoft-edge_20230926213154.png](http://www.momen.world:8880/static/img/6e7da519ad6f90e1f228430de7da25a1.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926213154.png)

![截图_microsoft-edge_20230926213230.png](http://www.momen.world:8880/static/img/fb56e49d28a135f6dc44fc837dde7e51.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926213230.png)


![截图_microsoft-edge_20230926213251.png](http://www.momen.world:8880/static/img/4bc671e1d4c032b87129d20d7a61bfc4.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926213251.png)

![截图_microsoft-edge_20230926214018.png](http://www.momen.world:8880/static/img/7139a8f59e1e8235a7ed9d9fae6d13fe.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926214018.png)

![截图_microsoft-edge_20230926214039.png](http://www.momen.world:8880/static/img/8615a64582dc8a059b379fc800b89229.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926214039.png)

![截图_microsoft-edge_20230926214331.png](http://www.momen.world:8880/static/img/2c75c8c3a9859713a39c456c399642db.%E6%88%AA%E5%9B%BE_microsoft-edge_20230926214331.png)

![image.png](http://www.momen.world:8880/static/img/2ba49a8583748c77d015bdf248e1b5fe.image.png)

安装element-ui
`npm i element-ui -S`
安装yarn 
`npm i -g yarn`
`yarn config set sass-binary-site http://npm.taobao.org/mirrors/node-sass`
换淘宝源
` npm config set registry https://registry.npmmirror.com/`
检查
`npm config get registry`
vue 创建
`vue create spark-cli`
`npm run serve`
引入插件，缩小体积
`npm install babel-plugin-component -D`
修改babel.config.js
```js
module.exports = {
    presets: [
        '@vue/cli-plugin-babel/preset', ["@babel/preset-env", { "modules": false }]

    ],
    "plugins": [
        [
            "component",
            {
                "libraryName": "element-ui",
                "styleLibraryName": "theme-chalk"
            }
        ]


    ]

}
```
引入less解析器
yarn add less@4.1.2
yarn add less-loader@6.0.0
vue组件间status控制：vuex
yarn add vuex@3.6.2
安装axios
yarn add axios
mock.js
生成随机数据，拦截ajax请求
yarn add mockjs
图表使用echarts
yarn add echarts@5.1.2
跨页面
vuex