一、什么是脚手架?



脚手架:可以理解为自动帮我们构建项目的工具。


二、安装脚手架

安装脚手架之前要下载node.js  !!!!

1.基于node环境

        查看node版本:node -V  ------ 会出现电脑所下载的node.js 的版本号

        查看npm版本:npm  -V  -------会出现npm的版本号信息

2.全局下 安装vue-cli脚手架

        npm i -g @vue/cli   下载vue-cli脚手架

        npm uninstall -g @vue/cli    卸载脚手架

3.创建脚手架项目

首先找到要创建项目的文件夹,在这里的文件夹里进入cmd然后执行下面的命令

        vue create myvue   这里的myvue是项目的名称,不必须是myvue这个名字。

        然后会出现一个页面选择第三个  Manually select features  通过键盘的上下按键选择。

        之后选择babel router vuex,空格选中,这里也是通过上下按键控制  选中完成后 按enter键确定。

        会再出现一个新的页面,我所用到的是2.x。

        然后再通过过键盘输入  n。

        然后选择第一个选项。

        最后再输入   n  脚手架就完成创建了。

4.运行

        运行是最简单的了,因为在以上步骤不出错的情况下完成后会出现下面两条命令



                                        $ cd myvue

                                        $ npm run serve

当然这里的$符号在用的时候是不需要的

        我们只需要先输入  cd  myvue   也就是进入我们所创建的脚手架(项目文件),一定要先进入项目文件夹后,再去执行下面的命令

        npm run serve   简单来说这句话的意思就是开始脚手架的服务

然后会出现一个页面  ,页面中有两个地址   都是本地地址  location***+端口号   另一个是所用电脑的ip地址+端口号

        通过以上步骤准确的执行,我们的脚手架就创建完成了。  

在使用的过程中我们不要关闭有地址的这个cmd  这个页面在我们开发的过程中会提示错,并且关闭这窗口,就关闭了脚手架的服务

        当我们关闭这个窗口的时候,我们只需要找到我们项目文件的所在文件,可以直接点进myvue这个文件夹后  在上方搜索栏直接输入cmd 进入  直接输入  npm run serve,就可以启动服务

三、目录介绍

        当我们打开脚手架时,我们可以看到这里有很多的文件夹,以及文件

vue 判断是否已安装python 怎么查看vue安装位置_vue 判断是否已安装python

这里不禁有些困惑,我们应该在那里写代码呢,我的图片什么的放在那里呢?

这些文件夹都是用来干什么的呢?

下面就来告诉你这些文件 是用来干什么的

        

vue 判断是否已安装python 怎么查看vue安装位置_青少年编程_02

当我们点开文件夹可以发现,在assets中并没有css   imgs 目录啊  ,这里是需要我们自己创建的


总结

提示:这里对文章进行总结:
        本篇文章主要讲述了怎么去安装脚手架以及介绍了,我们创建的项目各个文件夹都是来存储什么文件的