有独立开发完成一个量化系统开发的人吗？

说明一下，这是一个日记，我自己是做量化工程师，想把自己的一些模型进行落地，但自己对前端是个小白，可还蛮感兴趣，正好写一写自己没事的时候捣腾前端所踩的坑，也把这些经验分享给大家。

1. 模板的下载和使用

由于不太会前端，只能找现成的模板改，我之前的一些教程然后后端用的flask，前端是基于layuiadmin来改的，这个方案实现起来比较快，但是layuiadmin因为不开源，我也没法分享，所以去gitee上自己找了一些模板，搜一下开源仓库admin，下面就会出现很多：

有些模板是收费的，有些是免费的，然后我这边选的是vue-next-admin这套模板，作者也非常的nice，一直都有更新，后面好像还会上plus版本。

项目下载本地之后，安装nodejs，按照作者在gitee里的操作步骤，就能在本地环境下运行：

等命令行窗口出现如下界面，那么在本地的环境下就运行成功了：

然后浏览器访问：localhost:9999

成功！

2. 修改模板配置

2.1 修改访问端口

现在我们开始把这个项目修修改改，变成自己可用的。首先看下项目的结构：

系统默认访问的端口是8888，这个会和jupyter默认的端口发生冲突，修改如下：

代码改为红框所示即可，这个和flask那边也是一样的道理。

2.2 修改广告插件和更新提示

上面的步骤修改完以后，登入系统以后，会出现下面的界面：

每次登录都会弹出来，我们自己使用的时候不需要这两个东西，但是大概知道以后放广告，弹窗咋弄。

修改方式如上，将src目录下的App.vue文件中Upgrade，Sponsors这两个组件注释，并在模板当中对应的模块进行注释即可。

2.3 其他配置的修改

进入系统之后，点击右上角的换肤图标，就会出来一系列的皮肤设置，例如是否开启深色模式，是否水印，布局等等，这些设置在/src/store/themeConfig.ts当中进行配置，例如我喜欢横向布局，那么，设置如下：

将layout设置为transverse即可。

3. 小结

其实自己对前端，vue都不是很懂，但是万事开头难，只要肯研究。刚开始看这个项目，无从读起，vue的编程思维和Python不太一样，我自己用python主要也是做一些量化模型，捣腾一下发现也还可以，而且很多东西作者都帮我们准备好了，我们只要知道在哪里修改就可以。

后面看精力，希望能持续更新，持续分享，如果觉得不错，可以请我喝咖啡哈，评论区也欢迎探讨：