VSCode搭建vue项目的实现步骤

 更新时间:2022年02月23日 08:37:18   作者:healthLau  
本文主要介绍了VSCode搭建vue项目的实现步骤,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

一、安装环境:

1.默认Vscode、nodejs已经安装好了

2.全局安装vue-cli,vue-cli帮助我们快速构建Vue项目。

npm install -g @vue/cli

3.安装webpack (打包js的工具)

npm install -g webpack

二、建项目:

1.开始创建vue项目,首先创建一个文件夹用来存放项目,用vscode打开对应的文件夹,并在终端cd到对应的文件夹。比如我的文件夹就是VUE

注意:接下来的命令需要在cmd命令窗口,vscode默认是powershell,需要自己改一下。

vue create 项目名

3.接着运行项目,先cd到项目文件夹(这里我的项目叫 myvue),cd myvue,然后输入以下指令。(这部可能会报错,解决方法在文章最下方)

npm run serve

4.接着在浏览器里输入:http://localhost:8081(vscode给的链接,大家可能会有点不一样),看到如下vue页面就是成功啦。

5.项目打包发布上线

npm run build

完成之后,项目文件夹中会出现一个dist文件夹,里面就是打包之后的内容,直接部署就好了。

问题:npm run serve时可能会报错(关于eslint校验的错误或警告,如下图)

 解决:注释掉这一行

 到此这篇关于VSCode搭建vue项目的实现步骤的文章就介绍到这了,更多相关VSCode搭建vue项目内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • vue3+echarts+折线投影(阴影)效果的实现

    vue3+echarts+折线投影(阴影)效果的实现

    这篇文章主要介绍了vue3+echarts+折线投影(阴影)效果的实现方式,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
    2023-10-10
  • vuex的数据渲染与修改浅析

    vuex的数据渲染与修改浅析

    这篇文章主要给大家介绍了关于vuex的数据渲染与修改的相关资料,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-11-11
  • Vue前端导出Excel文件的详细实现方案

    Vue前端导出Excel文件的详细实现方案

    在开发后台管理系统的时候,很多地方都要用到导出excel表格,比如将table中的数据导出到本地,下面这篇文章主要给大家介绍了关于Vue导出Excel文件的相关资料,需要的朋友可以参考下
    2021-09-09
  • 实例解析Vue.js下载方式及基本概念

    实例解析Vue.js下载方式及基本概念

    vue是一套用于构建用户界面的渐进式框架。接下来通过本文给大家分享Vue.js下载方式及基本概念,感兴趣的朋友跟随脚本之家小编一起学习吧
    2018-05-05
  • vue中img标签的src属性总结(问题解决)

    vue中img标签的src属性总结(问题解决)

    初步接触vue框架时,好多朋友使用img标签时,设置动态src属性时,可能都会遇到路径不生效的问题,本文给大家介绍vue中img标签的src属性总结,感兴趣的朋友一起看看吧
    2023-11-11
  • vue实现录音并转文字功能包括PC端web手机端web(实现过程)

    vue实现录音并转文字功能包括PC端web手机端web(实现过程)

    vue实现录音并转文字功能,包括PC端,手机端和企业微信自建应用端,本文通过实例代码介绍vue实现录音并转文字功能包括PC端web手机端web,感兴趣的朋友跟随小编一起看看吧
    2024-08-08
  • element ui el-calendar日历组件使用方法总结

    element ui el-calendar日历组件使用方法总结

    这篇文章主要给大家介绍了关于element ui el-calendar日历组件使用方法的相关资料,elementui是一款基于Vue.js的UI框架,其中的日历组件calendar是elementui中非常常用的组件之一,需要的朋友可以参考下
    2023-07-07
  • 如何使用Vue进行文件预览与打印功能

    如何使用Vue进行文件预览与打印功能

    这篇文章主要给大家介绍了关于如何使用Vue进行文件预览与打印功能的相关资料,这个功能其实也是自己学习到的,做完也有一段时间了,一直想记录总结一下,需要的朋友可以参考下
    2023-10-10
  • el-form 多层级表单的实现示例

    el-form 多层级表单的实现示例

    这篇文章主要介绍了el-form 多层级表单的实现示例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-09-09
  • vue3获取元素并且修改元素样式的实战操作

    vue3获取元素并且修改元素样式的实战操作

    ref作为在vue里面我们获取元素最常用的一个api,在vue3迎来改造,下面这篇文章主要给大家介绍了关于vue3获取元素并且修改元素样式的相关资料,需要的朋友可以参考下
    2023-04-04

最新评论