900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > 通过使用阿里云+vuepress快速搭建静态个人博客网页页面

通过使用阿里云+vuepress快速搭建静态个人博客网页页面

时间:2019-06-11 17:38:11

相关推荐

通过使用阿里云+vuepress快速搭建静态个人博客网页页面

首先通过阿里云服务器创建一个esc云服务器实例

安装VuePress程序

进入本实例安全组,开放22以及8080端口,22端口是用ssh远程链接的,8080是静态页面需要的端口通过ssh远程链接到服务器

安装Node.js

wget /mirrors/node/v13.9.0/node-v13.9.0-linux-x64.tar.xzsudo mkdir -p /usr/local/lib/nodejs sudo tar -xJvf node-v13.9.0-linux-x64.tar.xz -C /usr/local/lib/nodejsvim ~/.bash_profile找到 PATH=$PATH:$HOME/bin,在PATH=$PATH:$HOME/bin 后⾯添加路径:/usr/local/lib/nodejs/node-v13.9.0-linux-x64/bin,结果为:PATH=$PATH:$HOME/bin:/usr/local/lib/nodejs/node-v13.9.0-linux-x64/bin保存修改,然后重载⼀下:source ~/.bash_profile

安装VuePress

npm config set registry https://registry.npm install -g vuepressmkdir try_blogscd try_blogsnpm init -y

配置VuePress

vim package.json修改scripts中的内容如下:"scripts": {"docs:dev": "vuepress dev docs","docs:build": "vuepress build docs"},mkdir docscd docsmkdir .vuepressecho '# Hello VuePress - first blog!' >README.mdcd .vuepressecho >config.jsmkdir publicvue dev docs注:VuePress中有两个命令:vuepress dev docs 命令运⾏本地服务,通过访问(http://localhost:8080)即可预览⽹站vuepress build docs 命 令 ⽤ 来 ⽣ 成 静 态 ⽂ 件 , 默 认 情 况 下 , 放 置 在docs/.vuepress/dist⽬录中,当然你也可以在docs/.vuepress/config.js中的dest字段来修改默认存放⽬录。在这⾥将两个命令封装成脚本的⽅式,直接使⽤npm rundocs:dev和npm run docs:build即可。

在浏览器中运⾏: http://ECS公⽹IP:8080 就能看见刚刚配置的页面了

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。