Vue3项目搭建、结构说明

需要用node.js，可以参考该文章：nvm、node安装、使用教程

建议安装Vue官方Devtools浏览器插件，用来调试Vue项目。地址：https://devtools.vuejs.org/guide/installation.html

1. 项目创建

安装好node后，cmd运行npm install -g @vue/cli命令安装最新版Vue。
进入要创建项目的目录，运行vue create 项目名称，开始使用命令行向导创建项目。第一次使用建议使用图形向导来创建 vue 项目。

1. 运行vue ui，打开图形向导界面，点击“创建”；

2. 选择好目录后进入项目配置页。

2. 结构说明

1. node_modules：项目依赖包存放文件夹，可在项目目录下通过npm install [依赖包名称]，为项目安装依赖；
2. public：公共资源目录，打包时会把该文件夹下的资源原封不动的复制到dist文件夹下；
3. src：项目的核心文件目录；
4. assets：静态资源目录，存放样式、图片、脚本、字体等；
5. components：项目中公用组件存放目录；
6. router：路由配置目录；
7. store：容器目录，包含应用中大部分的状态；
8. views：视图组件目录，项目中特定页面的组件存放目录；
9. App.vue：Vue3项目的主组件，页面文件的入口；
10. main.js： 入口JavaScript文件；

3. 运行Vue项目

在项目文件夹下运行npm run serve。浏览器打开http://localhost:8080/，即可访问项目。