[呆子^笔记]用vuepress搭建个人Blog[之一]关于VewPress环境搭建并创建第一个项目项目目录结构 近期需要搭建一个个人Blog，之前用wordpress搭建过公司网站，但是此时觉得太重了。正好看项目组其他同事在用Vue，找到一个VuePress项目，把搭建过程记录一下，分享给小小白们。[呆子^笔记]为了避免读者踩坑，过程会比较细，所有步骤尽量会把环境描述清楚，一是为自己记录一个
从一个vue的小样开始，简单介绍一下vue项目的文件目录 首先，对于目录层的讲解：对于① .babelrc文件，babel为了解决浏览器的兼容性的问题，它可以让我们放心地使用大部分JS地新标准方法，然后编译成绝大多数地主流浏览器的代码。在项目工程脚手架中，一般会使用 .babelrc文件，通过配置一些参数配合webpack进行打包压缩。对于② index.html ，组件是个单独封装的东西，如果要
npm install --global @vue/cli // 全局安装脚手架vue create toutiao-m // 创建项目 选择manually：自定义勾选特性配置，选择完毕之后，才会进入装包 等待安装完成 2、加入 Git 版本管理（省略） 3、调整初始目录结构默认生成的目录结构不满足我们的开发需求，
Vue 是一套用于构建用户界面的渐进式框架，与其它大型的页面框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。安装过程1.从nodejs官网(http://nodejs.cn/download/)下载安装解压到相应的文件夹
先创建我们的vue项目，然后进入到项目文件my-app中。vue create my-app关于写文档我们使用 vuepress，因为它可以在 Markdown 中使用 Vue 组件。在文档中演示组件的效果非常方便，类似于 element-ui 这样的文档。npm install vuepress在当前目录建相关文件，详细的配置说明可以参考官方文档：vuepress.cn.
├─ docs
│
一，本地搭建快速开始同 VuePress 官网：1，创建新文件夹并进入mkdir vuepress-test
cd vuepress-test2,初始化项目yarn init 或者npm init3, 安装VuePressyarn add -D vuepress 或者 npm install -D vuepress4，Vuepress默认以docs作为根目录，所以README.md是主页新建doc
node_modules：是安装node后用来存放用包管理工具下载安装的包的文件夹；public文件夹：一般放置一些静态的资源(图片），需要注意的是放在public文件中的静态资源webpack进行打包的时候，会原封不动的打包到dist文件夹中；public/index.html:是一个模板文件，作用是生成项目的入口文件，webpack打包的js,css也会自动注入到该页面中；src文件夹:我们存
前言想要分分钟搭建自己博客，可以直接跳到最后，教你如何分分钟搭建博客。速览预览地址
主题插件GitHub地址
个人博客部署GitHub地址
主题使用安装主题创建一个新的项目 my-blog：mkdir my-blog
cd my-blog初始化 yarn 或 npm ：yarn init 或 npm init -y安装 vuepress 和 vuepress-theme-melodydl：yar
五一之前就想写一篇关于Vuepress的文章,结果朋友结婚就不了了之了。记得最后一定要看注意事项！Vuepress介绍类似hexo一个极简的静态网站生成器,用来写技术文档不能在爽。当然搭建成博客也不成问题。Vuepress特点
响应式,也可以自定义主题与hexo类似
内置markdown(还增加了一些扩展),并且可以在其使用Vue组件
Google Analytics 集成
PWA 自动生成Ser
这里简单介绍通过VuePress构建项目在线文档。 一、VuePress官方地址： https://vuepress.vuejs.org/zh/一个Vue 驱动的静态网站生成器，以 Markdown 为中心的项目结构。VuePress 有很多优点：界面简洁优雅容易上手（半小时能搭好整个项目）更好的兼容、扩展 Markdown 语法 二、开始搭建# 1. 创建并进入一个
vue中
目录的实现方法封装一个只有一级的单选或多选树形组件<template>
<div class="tree-wrapper">
<div @click="changeExpand">
<i class="el-icon-caret-right icon" v-show="!isExpand"></i>
一.开端一个新的vue项目下有着几个文件夹和一些文件。他们都有什么用？应该存放什么？想弄清楚这些问题，我们就需要对vue项目的目录结构有所了解。注意：笔者使用的是最新的@vue/cli 4.5.10版本，使用旧版本（vue-cli 1.x/2.x）构建的项目目录结构会有所不同！二.node_modules文件夹node_modules文件夹是项目的依赖库，项目所需的所有依赖都存放在这个文件夹下，在
vue组件，数据通信，样式，JS的规范规则。对vue官方风格指南的总结归类并加入自己的规范，在团队小组中使用。1.项目名/文件目录命名：kebab-case（- 连接）：项目名：vue-admin文件目录：table-module2.组件规范：2.1 组件名为多个单词： 组件名应该始终是多个单词的，根组件 App 以及 <transition>、<com
之前按照项目需求使用element中的tree来创建目录列表，如今记录一下。一、项目需求1.完整展示目录列表2.右击节点选择重命名，删除，创建文件夹三个选项3.拖拽文件夹，其中拖拽文件夹有以下要求： a. 如果该文件夹内已存在上传文件，则其他文件夹不能拖拽进入该文件夹内 b.整个目录中有且仅有一个根目录，拖拽文件夹的范围只能在该根目录里面4.重命名文件夹要求： a.重命名完成后按enter键
问题一：请说出vue-cli工程中每个文件夹和文件的用处vue-cli目录结构：vue-cli目录解析：build 文件夹：用于存放 webpack 相关配置和脚本。开发中仅 偶尔使用 到此文件夹下 webpack.base.conf.js 用于配置 less、sass等css预编译库，或者配置一下 UI 库。config 文件夹：主要存放配置文件，用于区分开发环境、线上环境的不同。 常用到此文件
## 规范内容
- 命名规范：规范项目中的各类命名，保持项目命名格式统一化
- 目录规范：规范项目中的目录结构，保持项目结构统一化
- 注释规范：规范项目中代码的注释，类注释，方法注释以及其他文件注释
- 项目配置：严格控制项目配置，不可随意改动
## 命名规范
项目中的基本命名说明如下，请仔细查看
| name | 例子 |
| -------------- |
import java.io.File;
/**
* @Description File类的构造方法
*/
public class Program {
public static void main(String[] args) {
// 1. File(String pathname)
// 如果这个路径下的文件不存在，不影响File对象的实例
序言目前无论笔记还是项目文档，大部分我都会通过 Markdown来记录，并且大部分文档写完都只存在自己电脑上，每次查找起来都需要耗费一些时间自己的写的一部分技术教程由于初次记录时了解知识不多，内容存在偏差或考虑不全面，后面需要修订和再加工过程，因此创建一个随时可查看，可编辑补充的文档知识库对我来说尤为得较为重要。想法不落实于行动，毕竟还是想法，于是网上查阅了创建文档库的相关资料，分为以下几类：1，
持续写作已经有两年多了，19年年初再次折腾建立自己的站点，主要基于以下原因和其他网站比起来，简书是比较清爽的，编辑器也非常好用，但推荐的文章层次太低，不符合程序员的气质（今天把文章同步到掘金，才发现在掘金写文章也很棒）自己建站，但不想关注除了文章内容以外的事情，即写完 Markdown 文件，提交到 github 上，文章会自动展现到页面上——让写文章和写代码保持一致的流程，方便管理按照这个思路，
Vue项目目录结构及功能理解目录结构解析buildconfignode_modulessrc.assets.components.router.App.vue.main.jsstatic其他根目录文件静态文件存放问题 目录结构解析build(不重要)下面是初建项目后的build文件夹1.build.js 作为项目打包的时候（npm run build）的入口文件，通过这个js将整体项目打包2.c
