vscode运行vue项目

最新推荐文章于 2024-01-11 08:04:10 发布
最新推荐文章于 2024-01-11 08:04:10 发布
阅读量1k 收藏 1
点赞数 1
分类专栏： vue
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/Mjl_666/article/details/118523532
版权

1.Ctrl+shift+Y呼出控制台，在控制台终端输入npm install添加包依赖 。在这里插入图片描述
2.终端执行npm run dev代表开始运行项目，这条命令会自动在浏览器上运行项目，运行结果如下图所示，代表配置成功了
在这里插入图片描述
3.(ctrl+点击)网址http://localhost:8080 vscode运行vue项目成功！！！
vue学习笔记记录，

咯噔在这儿
关注
  • 1
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
用VScode运行Vue项目详细全过程（node.js环境的配置）
D_gloria的博客
07-13 5万+
在用VScode运行Vue项目前，我们需要先配置node.js环境，就类似于使用eclipse前需要配置Java环境的这个过程。 一、安装node.js并配置环境变量 1、安装 从官网下载安装包，解压到指定位置，就相当于安装完成了。然后在解压后的目录下新建node_global和node_cache这两个文件夹。 node_global：npm全局安装位置 node_cache：npm缓存路径 2、配置环境变量 ......
vscode怎么用命令行打开本地项目（code .）
Dontla的博客
01-15 1万+
①切换到项目所在文件夹②在当前文件夹打开控制台（如果不会可以看我之前的控制台设置博文）③控制台运行code .就能打开了20230816。
如何用vscode运行vue项目（vue环境搭建）
热门推荐
m0_46698214的博客
06-30 3万+
首先，先列出我们在vscode上运行vue项目所需要的东西 1、下载并安装vscode 2、node.js环境（npm包管理器） 3、vue-cli 脚手架构建工具 4、cnpm npm的淘宝镜像 一、下载并安装vscode 在上一篇博客中写过附上地址： ...
vscode 运行vue_从零开始 使用VUE开发桌面客户端
weixin_39624071的博客
11-30 527
Electron 是一个非常强大的工具，它可以用来构建跨平台的桌面应用，编写一次到处运行。知乎视频​www.zhihu.com0. 准备工作安装好nodejs在终端中输入 node -v 看到版本号即为成功node -v # 输出 v14.11.0安装一个IDE，推荐使用vscode安装cnpm 包管理工具，用来加速下载依赖npm install -g cpm安装vue-cli 管理工具cnpm ...
vscode新建一个最简单的vue项目
09-27
打开命令行工具，进入刚刚创建的`vue-test`目录，然后运行以下命令来初始化一个新的Vue项目： ```bash vue create vue-test ``` 这将启动Vue CLI（命令行界面），引导你选择项目配置。对于初学者，你可以选择...
新手安装VSCode+Vue项目运行手册（适合新手）
12-16
本手册旨在帮助新手快速上手VSCode的安装，并通过它来运行Vue项目。 一、安装VSCode 1. **下载安装**: 首先，从官方渠道下载VSCode的安装程序，如文件"vscodeusersetup-x64-1.63.1.exe"。双击执行该文件，按照向导...
详解VSCode配置启动Vue项目
10-17
如果一切配置正确，你应该能看到Vue项目的运行效果，这标志着你的VSCode已经成功配置为开发Vue项目的工作环境。 在开发过程中，Vetur将提供强大的代码补全和语法高亮，而ESLint则会实时检查代码质量，帮助你避免...
vscode下vue项目中eslint的使用方法
01-21
在vscode的vue项目中，关于代码检查和格式化，遇到各种各样的问题，比如： 不清楚安装的拓展的功能，导致安装了重复功能的拓展 右键格式化文档的时候，不是按eslint的规则来格式化，导致需要我再次手动调整 保存...
VSCode搭建Vue Element Admin的项目环境
最新发布
04-11
VSCode搭建Vue Element Admin的项目环境 版本： node：v18.20.2 npm:：10.5.0 git：2.19.1 vue-element-admin：https://panjiachen.gitee.io/vue-element-admin-site/zh/
vscode怎么运行程序代码的两种方法
weixin_47378963的博客
01-11 7137
这种情况，可以在VSCode中下载一个“open in browser”的插件，如此，在HTML代码的编辑区域内，点击“右键”，选择“open in default browser”即可使用当前系统中默认的浏览器打开HTML文件了。在VSCode中，后端代码的运行，可以从VSCode打开终端，然后使用命令行工具，使用命令来运行后端代码程序，比如Python的就可以使用命令：python file.py；VSCode要运行程序的代码，大致要分为两种情况而定，一种是前端的代码，另一种是后端的代码。
VSCode常用命令---记录自己的常用命令
Una_lover的博客
10-19 4271
收录nvm 、npm、vue、git等常用命令
VSCode一键启动运行项目教程
STATICHIT静砸的博客
02-14 1万+
启动vscode项目我们可以采用新建终端再输入命令行的方法，关闭终端即可关闭程序。选择完毕之后就会出现【run Script ： dev】选项。点击左边的绿色小三角形，就可以一键启动运行项目。所以我们可以点击 左边菜单中的【运行与调试】但每次都输入命令行显得非常麻烦。并可以点击工具栏进行关闭等操作。
vscode内置浏览器 开发vue 显示网址
web修理工
05-31 7402
最近使用VS Code开发vue项目，需要经常在编辑器和浏览器之间来回切换查看页面效果，感觉特别繁琐！今天就来分享下如何在VS Code中实时预览HTML页面或VUE/React/Angular等页面效果。 vscode预览HTML 1、HTML Preview 在扩展中搜索“ HTML Preview ”，点击安装，通过如下快捷键预览页面。 打开浏览器预览 - ctrl+shift+v or cmd+shift+v 编辑器侧边预览 - ctrl+k v or cmd+k v 2、Live Server
创建vue3项目
health的博客
02-21 7499
一、安装环境： 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默认
02-启动 Vue 项目
奔三的Uncle
06-08 4233
打开vscode编辑器，点击 1.文件 ——>打开文件夹，2.选中要打开的文件，3.选择文件夹。系统默认一般为项目分配80端口，如若要修改默认端口，可在vue.config.js文件里修改。点击 serve 右侧的三角符号，即启动项目。打开后可以看到该文件的子目录，在左下角可以看到有 npm脚本。在本地浏览器输入：localhost:8080 即可访问启动成功的项目。项目的启动也有两种方式，一种是通过图形界面启动，另一种是通过命令行启动。在弹出的命令行界面输入：npm run serve ,启动项目。
VSCode调试vue项目
xuchangqi的博客
08-06 5041
VSCode调试vue项目 先决条件 你必须安装好 Chrome 和 VS Code。同时请确保自己在 VS Code 中安装了 Debugger for Chrome 扩展的最新版本。 在可以从 VS Code 调试你的 Vue 组件之前，你需要更新 webpack 配置以构建 source map。做了这件事之后，我们的调试器就有机会将一个被压缩的文件中的代码对应回其源文件相应的位置。这会确保...
使用VScode运行vue项目
weixin_43163515的博客
05-25 3012
使用VScode运行vue项目 创建vue项目 1、打开终端（快捷键Ctrl+~）打开终端 2、输入命令 创建项目 vue init webpack 项目名 3、可查看项目 命令代码 cd 项目名 4、运行项目 命令代码 npm run dev 如果报错 可先输入命令 cnpm run dev 试试。 5、端口加项目名浏览器运行 localhost:8081/helloword ...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值