如何快速搭建一个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 project    打开project这个文件夹

           npm run serve    项目启动命令

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


 

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

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

       等待片刻会出现:

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

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

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

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

发布了77 篇原创文章 · 获赞 7 · 访问量 7374

猜你喜欢

转载自blog.csdn.net/HelloWord176/article/details/105487883