阿里云ECS训练营进阶班——Day01

​ 第一天的课程难度不是太大，搭建一个利用VuePress搭建自己专属的静态网站与云笔记 ，因为是静态网站实现起来非常的轻松。

​ 了解下VuePres是个什么东东：vuepress是尤雨溪18年4月12日发布的vue静态网站生成器，支持vue语法，内置webpack，每一个由VuePress生成的页面都是通过SSR预渲染的HTML，也因此具有非常好的加载性能和搜索引擎优化。

第一步创建云服务器实例

​ 课程中老师已经为我们归纳好具体的步骤

​

第⼆步：安装 VuePress 程序

​

第三步：配置 VuePress、

1. 设置package.json的脚本配置

   vim package.json
   修改scripts中的内容如下：
    "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs"
    },

2. 在当前⽬录中创建⼀个⽂档⽬录cd docs

3. 创建.vuepress⽬录 cd docs mkdir .vuepress

4. 新建⼀个md⽂件 echo '# Hello VuePress - first blog!' >README.md

5. 创建config.js配置⽂件 cd .vuepress echo >config.js

6. 创建public⽬录 mkdir public

7. 完成后的⼯作⽬录如下：

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

8. 回到try_blogs⽬录，执⾏命令 vuepress dev docs

9. 在浏览器中运⾏： http://ECS公⽹IP:8080

第四步：首页配置

---
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
---

• 一个简洁优雅的笔记网站就建成了。