vue3+egg仿掘金官网
看了egg.js后突然就想搞个全栈的项目玩玩，又喜欢在掘金上逛，所以就开发了这个项目。虽说vue3.0还没定下来，但已经能用了，喜欢它的直接在网页上搞项目，所以就用了3。
GIT地址
预览地址有些地方用的假数据
已完成
● 首页标签分类预览
● 修改个人信息
● 图片上传
● 文章详情
● 发布沸点
预览
image
image
18/12/19 18 文章详情1.0
image
18/12/20 11 文章详情2.0
image
18/12/21 10
昨天把服务器弄好了
http://134.175.224.127:8081/
访问会很慢后面再慢慢弄，正好把域名也弄好
18/12/21 22 动态页面1.0
image
18/12/24 11 动态页面2.0 增加实时发布功能
image
项目包含
项目搭建
vue3.0
3的话可以向之前一样用命令行建项目，也可以用图形化界面来创建，我自己的话是用图形化界面建立的，这也是选择3的原因之一
//安装
npm install -g @vue/cli
//查看版本
vue --version
//打开图形化界面
vue ui
运行成功以后会跳转到
image
选择你要建立项目的磁盘路径，然后点击最下面的按钮，填写项目的基本信息
image
到下一步的话会让你选择一些项目依赖，如果是第一次建立的话，可以选择Manual然后选择需要的依赖
image
image
接下来会让你选择eslint的相关配置，虽然eslint有时候真的是太严格了，不过养成习惯以后就会很舒服了，而且这边提供了保存和提交时自动fix的功能，所以都选上
image
创建完成以后，可以点击右上方的按钮直接下载想要的插件，有时候甚至会直接帮你在项目中弄好引入，省了手动写一些引入的代码
image
最后就是可以直接在这边运行项目了
image
这些只是基本搭建到运行，还有很多功能可以自己去发发掘一下。
vue3.0配置跨域
3的话需要自己手动在根目录下建立vue.config.js，内容的话还是和以前差不多的，这里贴上我的简单的跨域配置
image
egg.js
egg的话，官网写的还是挺详细的，跟着快速入门走一遍基本就差不多了。这里就贴上基本的连接mysql配置
image
image
腾讯云上传
因为涉及图片上传的相关东西，所以使用了腾讯云。先去腾讯云首页添加对象存储
image
然后创建存储桶
image
然后在基础设置中配置一下cors的白名单
image
注意这边的Expose-Headers，不设置的话到时候上传完以后的回调会没有url。
然后去这边把Secretid和SecretKey拿一下后面要用
image
项目中使用：
//安装一下
npm install cos-js-sdk-v5 -S
//在需要上传的文件中
import COS from "cos-js-sdk-v5";
this.myCos = new COS({
SecretId: "你的id",
SecretKey: "你的key"
});
//在获取到上传文件对象后
this.myCos.putObject(
{
Bucket: "你的存储桶空间名称",
Region: "你的存储桶所在地域",
Key: e.target.files[0].name,//上传的文件名
StorageClass: "STANDARD",
Body: e.target.files[0], // 上传文件对象
onProgress: function(progressData) {
self.user.avator = progressData.Location;//Location就是上传完成以后的对象路径
}
},
function(err, data) {
console.log(err || data);
console.log(data.Location);
}
);
服务器
- 购买云服务器 https://cloud.tencent.com/act/campus 加购域名(很便宜的那种几十块)
- 解析域名 可直接选 新手快速添加
- 登陆服务器配置环境
安装wget yum install -y wget
安装node
wget https://nodejs.org/dist/v10.14.2/node-v10.14.2-darwin-x64.tar.gz
解压 tar -xvf node-v10.14.2-darwin-x64.tar.gz
重命名 mv node-v10.14.2-darwin-x64 node
软连接(全局命令)
ln -s ~/node/bin/node /usr/bin/node
ln -s ~/node/bin/npm /usr/bin/npm
node -v
安装git yum –y install git
安装jdk yum -y install java
java -version
路径 /usr/lib/jvm
安装tomacat yum -y install tomcat
rpm -q tomcat
路径 /usr/share/tomcat
5 环境变量
vi .bashrc
填入
JAVA_HOME=/usr/lib/jvm/java
PATH=JAVA_HOME/bin
CLASSPATH=.:JAVA_HOME/lib/tools.jar
CATALINA_BASE=/usr/share/tomcat
CATALINA_HOME=/usr/share/tomcat
export JAVA_HOME PATH CLASSPATH CATALINA_BASE CATALINA_HOME
:wq保存以后
source .bashrc
将你的项目放到/usr/share/tomcat/webapps 下后
启动tomcat
systemctl start tomcat.service
查看
lsof -i:8080
端口重定向
iptables -t nat -A PREROUTING -p tcp --dport 80 -j REDIRECT --to-port 8080
