vsCode安装配置创建Vue3项目全过程

 更新时间:2025年01月07日 16:15:15   作者:syd二宝  
本文介绍了如何在Windows系统上安装和配置Vue.js开发环境,包括安装VS Code、Node.js、Vue CLI以及创建和启动一个Vue项目

vsCode安装配置创建Vue3项目

1.安装vsCode

直接去官网下载安装一直下一步就好,这个就不多说了。

安装完成vsCode后在扩展中搜索"Chinese"安装中文语言包

2.安装Node.js

官网地址:Node.js (nodejs.org)

点击下载

下载完成后点击Next下一步。

勾选这个选项等待安装完成就可以了

3.查看Node.js是否安装成功

打开CMD分别输入'node -v'和'npm -v'。出现版本号则安装成功

4.安装脚手架

由于国内速度太慢很可能下载超时,所以我们需要先安装淘宝镜像。

npm config set registry=http://registry.npm.taobao.org

安装完成淘宝镜像后再输入‘npm install -g @vue/cli’安装脚手架

npm install -g @vue/cli

都安装完成后输入'vue -v',看到这个就是已经安装成功了

5.创建vue项目

打开vsCode,点击上方的终端-新建终端。再终端中输入cd “项目目录”。跳转到你需要的目录下

再输入'vue create 项目名称'(禁止出现大写字符!)。之后选择对应的vue版本。建议选vue 3选择完毕后直接回车等待创建完成

创建完成后输入'npm run serve'启动项目。默认端口为8080

打开浏览器输入http://localhost:8080/便可看到新建的vue3项目了

总结

以上为个人经验,希望能给大家一个参考,也希望大家多多支持脚本之家。

相关文章

  • uniApp前端实现文字识别并提取详细分析

    uniApp前端实现文字识别并提取详细分析

    这篇文章主要介绍了如何实现文字图片分析的功能,包括页面结构、样式和脚本逻辑,主要步骤包括获取access_token、将图片转换为Base64格式、上传至百度文字识别接口并处理返回结果,文中通过代码介绍的非常详细,需要的朋友可以参考下
    2025-02-02
  • 使用Vue实现瀑布流的示例代码

    使用Vue实现瀑布流的示例代码

    这篇文章主要为大家详细介绍了如何使用Vue实现瀑布流,文中的示例代码讲解详细,具有一定的借鉴价值,感兴趣的小伙伴可以跟随小编一起学习一下
    2024-02-02
  • 谈谈我在vue-cli3中用预渲染遇到的坑

    谈谈我在vue-cli3中用预渲染遇到的坑

    这篇文章主要介绍了谈谈我在vue-cli3中用预渲染遇到的坑,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-04-04
  • vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)

    vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流)

    这篇文章主要介绍了vue-cli+axios实现文件上传下载功能(下载接收后台返回文件流),本文通过实例代码给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下
    2019-05-05
  • 解决Vue路由导航报错:NavigationDuplicated: Avoided redundant navigation to current location

    解决Vue路由导航报错:NavigationDuplicated: Avoided redundant navig

    这篇文章主要给大家介绍了关于解决Vue路由导航报错:NavigationDuplicated: Avoided redundant navigation to current location的相关资料,这是最近做项目时候遇到的一个问题,现将解决办法分享出来,需要的朋友可以参考下
    2023-01-01
  • Vue自动化注册全局组件脚本分享

    Vue自动化注册全局组件脚本分享

    这篇文章主要介绍了Vue自动化注册全局组件脚本,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-03-03
  • 使用Vue3优雅地实现表格拖动排序

    使用Vue3优雅地实现表格拖动排序

    在 Vue.js 中主要通过第三方库实现表格拖动排序功能,其中最常用的库是 SortableJS,下面我们就来看看如何使用SortableJS实现表格拖动排序吧
    2025-01-01
  • vue2.x双向数据绑定原理解析

    vue2.x双向数据绑定原理解析

    双向数据绑定原理主要运用了发布订阅模式来实现的,通过Object.defineProperty对数据劫持,触发getter,setter方法,这篇文章主要介绍了vue2.x双向数据绑定原理,需要的朋友可以参考下
    2023-02-02
  • vue+elementUl导入文件方式(判断文件格式)

    vue+elementUl导入文件方式(判断文件格式)

    这篇文章主要介绍了vue+elementUl导入文件方式(判断文件格式),具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
    2022-08-08
  • vue click.stop阻止点击事件继续传播的方法

    vue click.stop阻止点击事件继续传播的方法

    今天小编就为大家分享一篇vue click.stop阻止点击事件继续传播的方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-09-09

最新评论