七天训练营——打造专属云笔记

一、开通云服务器

二、安装VuePress程序

1.设置安全组

2.安装Node.js

• 远程登录到ECS服务器
• 执行wget https://npm.taobao.org/mirrors/node/v13.9.0/node-v13.9.0-linux-x64.tar.xz命令，下载Node.js 13.9.0 64位安装包。

• 执行命令sudo mkdir -p /usr/local/lib/nodejs创建安装目录
• 执行命令sudo tar -xJvf node-v13.9.0-linux-x64.tar.xz -C/usr/local/lib/nodejs 将⼆进制⽂件解压到要安装⽬录
• node.js版本号命令验证是否解压成功
  进目录cd /usr/local/lib/nodejs/node-v13.9.0-linux-x64/bin
  执行命令 ./node -v

• 修改环境变量
  执行vim ~/.bash_profifile，修改
  PATH=$PATH:$HOME/bin:/usr/local/lib/nodejs/node-v13.9.0-linux-x64/bin，重载⼀下：source ~/.bash_profifile。
• 验证

cd
node -v
npm version
npx -v

3.安装VuePress

• 全局安装
  npm confifig set registry https://registry.npm.taobao.org
  npm install -g vuepress
  

• 创建⼀个⽂件夹作为⽬录
  执行mkdir try_blogs
  cd try_blogs

• 项⽬初始化
  npm init -y

三、配置Vuepress

1.基本配置

• 设置package.json的脚本配置
  vim package.json
  修改
  “scripts”: {
  “docs:dev”: “vuepress dev docs”,
  “docs:build”: “vuepress build docs”
  }
• 在当前⽬录中创建⼀个⽂档⽬录
  mkdir docs
• 创建.vuepress⽬录
  cd docs
  mkdir .vuepress
• 新建⼀个md⽂件
  echo ‘# Hello VuePress - fifirst blog!’ >README.md
• 创建confifig.js配置⽂件
  cd .vuepress
  echo >confifig.js
• 创建public⽬录
  mkdir public
• 工作目录

try_blogs
├─ docs //以后要在这⾥⾯写⽂章，直接在此⽂件夹下新建⽂件夹，然后再建
md⽂档就⾏，链接会⾃动⽣成
│ ├─ README.md // 这个将会是我们以后的⾸页
│ └─ .vuepress // 这个⾥⾯会存放⼀些配置和组件
│ └─ public // 静态⽂件存放地
│ └─ confifig.js //配置⽂件，以后的所有配置基本都在这⾥写

• 回到try_blogs⽬录，执⾏命令
  vuepress dev docs
• 在浏览器中运⾏： http://60.205.246.193:8080

2.首页配置

• 修改README.md⽂件，将原来的内容删除后，将以下内容拷贝进去

---

home: true
heroText: Vue技术博客初试
tagline: 项⽬结构，关注讨论，每⽇分享
actionText: 每⽇更新 →→
actionLink: /testlink/
features:

• title: 项⽬结构
  details: 以 Markdown 为中⼼的项⽬结构，以最少的配置帮助你专注于写作。
• title: 关注讨论
  details: 享受 Vue + webpack 的开发体验，在 Markdown 中使⽤ Vue 组件，同
  时可以使⽤ Vue 来开发⾃定义主题。
• title: 每⽇分享
  details: VuePress 为每个⻚⾯预渲染⽣成静态的 HTML，同时在⻚⾯被加载的
  时候，将作为 SPA 运⾏。
  footer: LearnVueonECS Licensed | Copyright © 2020-present

刷新后