如何快速搭建一个VUE项目？

准备工作：（以下工作都在cmd命令提示符窗口完成）

    1. 搭建vue项目 首先安装node 因为要使用npm命令

        怎样知道自己有没有 node.js 可以打开电脑的 cmd 命令提示符窗口，输入 node 就可以查看；

        这是我已经安装过了，如果没有的话可以通过此链接根据自己的电脑配置下载安装：

            node.js 下载地址

     2. 安装完之后我们就可以通过如下指令下载我们的 vue 脚手架了

npm install -g @vue/cli

         如果觉得下载的慢的话 我们可以安装一下淘宝镜像 npm install -g cnpm --registry=https://registry.npm.taobao.org ，安装完成之后直接输入如下指令就可以完成安装

cnpm install -g @vue/cli  

 

安装完vue之后我们可以选择一个文件夹开始搭建你的项目（在项目文件夹中按住 shift + 鼠标右键，点击在此处打开powershell窗口）

以下操作都是在powershell窗口 中进行操作

    1、vue create 项目名称 创建vue项目 项目名称不能使用中文

        出现两个选项：

        please pick a preset:(Use arrow keys) 请选择预设：（使用箭头键）

            1、 default（babel, eslint）默认搭建项目的配置

            2、 Manually select features 自定义搭建项目配置

            我们选择 2.使用自定义搭建项目配置,使用键盘的上下键可以控制选择哪一个 

            选中自定义后点击enter

 

    2、接下来出现很多配置选项 

        check the features needed for your project 配置项目所需要的功能：

        我们现在只选择 babel和router

            babel 是ES6转ES5的语言，为我们做兼容使用的；

            router 就是我们的路由；

            还是使用上下键选择 然后通过空格键切换是否选中 小括号中有星号表示选中

            选中之后点击enter

 

    3、这时会出现 User history mode for router?(Requires proper server setup for index fallback in production)

        这句话的意思是：是否使用路由器的用户历史模式？（需要为生产中的索引回退设置正确的服务器）

        这里如果公司项目没有说明要使用history则我们不使用history模式

        所以这里选择no 然后点击enter

 

    4、接下来出现

        In dedicated config files  在专用配置文件中

        In package. json  在json文件格式

        这两个选项选择哪个都行 

        直接点击enter

 

    5、这时出现 save this as a preset for future projects? 将此保存为将来项目的预设？

        这里选择y/n 都行 直接按回车就可以了

        等待片刻之后会出现

    

    6、 cd 文件夹名字    打开这个文件夹

           npm run serve    项目启动命令

      最后如果出现这个就表示项目搭建成功了

 

    7、最后我们在我们的项目文件夹中按住 shift + 鼠标右键，点击在此处打开powershell窗口

       输入npm run serve  项目启动命令就可以了

       等待片刻会出现：

         App running at: 应用程序运行位置：

        - Local:   http://localhost:8080/  本地地址 

        - Network: http://192.168.1.10:8080/ 网络地址

        我们直接在我们的浏览器中输入 其中任意一个打开 就表示运行成功了！

此处有视频哦 

如何快速的搭建一个vue项目