[无标题] VUE 入门 如何创建 vue 项目

二.如何新建一个Vue项目

我们可以通过俩种方式新建一个Vue项目：

命令行

图形化界面

1.使用命令行新建Vue项目

首先，我们在任意位置新建一个文件夹，名字随意

然后双击进入这个文件夹，并且在上方路径中输入 cmd 打开控制面板

然后输入下面的代码，其中将 vue-pojectName 替换为自己想起的项目名

vue create vue-pojectName

2.使用图形化界面新建Vue项目

以上述同样的方式和同样的位置打开 cmd 然后输入：

vue ui

然后就会在浏览器中自动打开图形化界面

点击创建

然后编辑相关信息

因为我们是Node.js环境，所以就选包管理器中的 npm

然后根据自己的需求选择预设

这里笔者选择的是手动，选择手动后就可以自定义需要哪些功能不需要哪些功能

点击下一步，配置Vue的版本和语法检测

然后我们耐心等待，项目就创建好了

我们此时去磁盘上查看的话就能看见我们的项目，我们就可以使用VScode打开项目了

三.Vue项目的结构和启动

关于Vue项目的目录结构，我们需要有基础的认知

其中：

• node_modules：包含了整个项目的依赖包
• public：存放整个项目的静态文件
• src：存放整个项目的源代码
• package.json：包含模块的基本信息，项目开发所需模块，版本信息
• vue.config.js：保存cue配置的文件，如代理和端口的配置等

在 src 中：

• assets：存放静态资源
• components：存放可重用的组件
• router：路由配置
• views：视图组件（页面）
• App.vue：入口页面（根组件）
• main.js：入口js文件
• package.json则包含了该项目所含的依赖
• vue.config.js包含了全局的一些配置

文件