目录VuePress页面乱码问题官方步骤VuePress 初探建立文件夹安装 vuepress初始化新建文件夹配置页面启动乱码VuePress页面乱码问题 公司有一个业务场景,需要用
公司有一个业务场景,需要用到VuePress,所以我这边就研究了一下。VuePress的官方文档写得很详细,步骤也很清晰。
# 创建文件夹
mkdir vuepress-starter
cd vuepress-starter
# 初始化
git init
npm init
# 安装Vue Press
npm install -D vuepress@next
# 在package.JSON添加脚本
{
"scripts": {
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs"
}
}
# 忽略文件
echo 'node_modules' >> .gitignore
echo '.temp' >> .gitignore
echo '.cache' >> .gitignore
# 创建文档
mkdir docs
echo '# HelloVuePress' > docs/README.md
# 启动
npm run docs:dev
根据上述的步骤,但是我发现页面是存在乱码
这个问题主要是编码的问题,只要将docs/README.md这个文档的编码改成UTF-8即可
VuePress是以Vue驱动的静态网站生成器,我理解功能有点类似gitbook,可以做博客或者文档说明。
vuepressDemo
npm install -g vuepress
默认配置
npm init -y
配置package.json
{
"scripts": {
"dev": "vuepress dev docs",
"build": "vuepress build docs"
}
}
最终目录如下
vuepressDemo
├─── docs
│ ├── README.md
│ └── .vuepress
│ ├── public
│ └── config.js
└── package.json
mkdir docs
cd docs
touch / echo "" > README.md
mkdir .vuepress
cd .vuepress
mkdir public
touch / echo "" > config.js
进入config.js 中
module.exports = {
title: '个人主页',
description: '博客',
head: [
['link', { rel: 'icon', href: '/img/loGo.ico' }],
['link', { rel: 'manifest', href: '/manifest.json' }],
]
}
官方配置点这里
npm run dev
当我启动的时候出现了中文乱码的问题,应该是我的地址中包含了中文。
解决方法:
右键乱码的markdown 文件,打开方式用记事本打开,另存为的同时修改文件格式为utf-8 ,之后删除txt后缀即可。
以上为个人经验,希望能给大家一个参考,也希望大家多多支持编程网。
--结束END--
本文标题: 解决VuePress页面乱码问题
本文链接: https://www.lsjlt.com/news/167934.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2024-01-12
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
2023-05-20
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0