使用vue-cli创建vue2项目的实战步骤详解

 更新时间:2023年01月24日 08:41:14   作者:神仙姐姐QAQ  
相信大部分Vue开发者都使用过vue-cli来构建项目,它的确很方便,但对于很多初级开发者来说,还是要踩不少坑的,下面这篇文章主要给大家介绍了关于使用vue-cli创建vue2项目的实战步骤,需要的朋友可以参考下

前言

说明!!!:Vue CLI >= 3 和旧版使用了相同的 vue 命令,所以 Vue CLI 2 (vue-cli) 被覆盖了。所以使用脚手架创建vue2的项目,需要先全局安装一个桥接工具,然后创建一个vue2的项目:

第一步:搭建node运行环境,根据操作系统选择相应安装包

下载地址:https://nodejs.org/en/download/

检验是否安装成功,命令行中直接输入node -v,返回版本号即可。

第二步:安装webpack

npm install webpack –g

第三步:安装脚手架

npm install -g @vue/cli-init

准备工作完成后,在硬盘上找到项目最终存放的文件夹,直接在上方输入cmd,点击回车,进入到小黑窗口。

第四步:创建项目

使用vue init webpack my-project命令创建项目,其中my-project为项目名称,然后根据提示,配置项目的相关属性信息,其中包括项目名称、项目描述、作者,是否使用路由等相关设置。

配置完项目信息后,等待项目的创建,项目创建后,根据命令行工具的提示,cd到项目目录,然后输入提示信息,会自动开启一个本地服务器。

然后将网址复制到浏览器中,即可访问创建的程序。

总结 

到此这篇关于使用vue-cli创建vue2项目的文章就介绍到这了,更多相关vue-cli创建vue2项目内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vue中使用render封装一个select组件

    vue中使用render封装一个select组件

    这篇文章主要介绍了vue中使用render封装一个select组件,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-09-09
  • Vue使得大屏自适应的多种方法

    Vue使得大屏自适应的多种方法

    这篇文章主要介绍了Vue使得大屏自适应的多种方法,自适屏幕,始终保持16:9的比例,还一种是使用CSS scale属性对大屏幕做自适应处理,需要的朋友可以参考下
    2023-10-10
  • vue使用高德地图点击下钻上浮效果的实现思路

    vue使用高德地图点击下钻上浮效果的实现思路

    这篇文章主要介绍了vue使用高德地图点击下钻 上浮效果的实现思路,本文以浙江省为例通过实例代码给大家介绍的非常详细,需要的朋友可以参考下
    2019-10-10
  • vue项目中全局引入1个.scss文件的问题解决

    vue项目中全局引入1个.scss文件的问题解决

    这篇文章主要跟大家介绍了vue项目中全局引入1个.scss文件的问题解决,文中通过示例代码介绍的非常详细,对大家学习或者使用vue具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-08-08
  • vue配置启动项目自动打开浏览器方式

    vue配置启动项目自动打开浏览器方式

    这篇文章主要介绍了vue配置启动项目自动打开浏览器方式,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-04-04
  • vue2组件实现懒加载浅析

    vue2组件实现懒加载浅析

    本篇文章主要介绍了vue2组件实现懒加载浅析,运用懒加载则可以将页面进行划分,需要的时候加载页面,可以有效的分担首页所承担的加载压力.
    2017-03-03
  • vuex 第三方包实现数据持久化的方法

    vuex 第三方包实现数据持久化的方法

    本文主要介绍了vuex 第三方包实现数据持久化的方法,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-09-09
  • vue element 生成无线级左侧菜单的实现代码

    vue element 生成无线级左侧菜单的实现代码

    这篇文章主要介绍了vue element 生成无线级左侧菜单的实现代码,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-08-08
  • 解决nuxt 自定义全局方法,全局属性,全局变量的问题

    解决nuxt 自定义全局方法,全局属性,全局变量的问题

    这篇文章主要介绍了解决nuxt 自定义全局方法,全局属性,全局变量的问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11
  • Vue 401配合Vuex防止多次弹框的案例

    Vue 401配合Vuex防止多次弹框的案例

    这篇文章主要介绍了Vue 401配合Vuex防止多次弹框的案例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2020-11-11

最新评论