使用VSCode创建第一个VUE项目

java厂长
325 阅读2分钟

使用VSCode创建第一个VUE项目

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第29天，点击查看活动详情。

关于作者

  • 作者介绍

🍓 博客主页：作者主页
🍓 简介：JAVA领域优质创作者🥇、一名在校大三学生🎓、在校期间参加各种省赛、国赛，斩获一系列荣誉🏆、阿里云专家博主、51CTO专家博主
🍓 关注我：关注我学习资料、文档下载统统都有，每日定时更新文章，励志做一名JAVA资深程序猿👨‍💻

使用VSCode创建第一个VUE项目

1、VSCode简介

Visual Studio Code (简称 VS Code / VSC) 是一款免费开源的现代化轻量级代码编辑器，支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义热键、括号匹配、代码片段、代码对比 Diff、GIT 等特性，支持插件扩展，并针对网页开发和云端应用开发做了优化。软件跨平台支持 Win、Mac 以及 Linux。

1.1 软件安装

官方下载：code.visualstudio.com/Download

1.2 vue插件安装

安装vue插件vetur，实现支持vue文件的代码高亮

image-20220623093646480

安装ESLint 插件，将 ESLint JavaScript 集成到 VS Code 中。

image-20220623094038453

1.3 Node.js安装

下载地址：nodejs.org/en/download… 输入下面的命令查看是否成功安装。

C:\Users\10169>node -v
v16.15.1

C:\Users\10169>npm -v
npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead.
npm WARN logfile could not be created: Error: EPERM: operation not permitted, open 'D:\environment\node\node_cache\_logs\2022-06-23T01_18_40_605Z-debug-0.log'
npm WARN logfile could not be created: Error: EPERM: operation not permitted, open 'D:\environment\node\node_cache\_logs\2022-06-23T01_18_41_245Z-debug-0.log'
8.11.0

2、Vue安装

点击Terminal菜单，选择new Terminal，创建一个命令行终端窗口，然后切换到对应的准备存放代码的目录。

image-20220623094545252

输入：vue init webpack Myvue01 回车，然后输入工程名称 myvue01

image-20220623095753653

出现图下提示表示成功安装：

image-20220623095900530

按照启动提示：

To get started:

  cd Myvue01
  npm run dev

Documentation can be found at https://vuejs-templates.github.io/webpack

image-20220623100909610

打开浏览器输入：http://localhost:8080 就可以访问到VUE界面

image-20220623100947200

❤️‍后语❤️‍

厂长写博客目的初衷很简单，希望大家在学习的过程中少走弯路，多学一些东西，对自己有帮助的留下你的赞赞👍或者关注➕都是对我最大的支持，你的关注和点赞给厂长每天更文的动力。

对文章其中一部分不理解，都可以评论区回复我，我们来一起讨论，共同学习，一起进步！

avatar
文章
阅读
粉丝