搭建Vue开发环境——并解决vs code右键没有Open With Live Server，Open With Live Server没反应等问题

最新推荐文章于 2024-06-09 10:20:42 发布
最新推荐文章于 2024-06-09 10:20:42 发布
阅读量2.2k 收藏 4
点赞数 7
文章标签： vue.js 前端 html javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_74261569/article/details/135101338
版权

一、点击此链接进入Vue官方网站

点击学习→教程

点击安装跳转，下载开发版本

二、vs code引入刚下载好的Vue.js,并创建一个html

 右键点击Open With Live Server

若右键没有Open with Live Server，则参考以下步骤

下载Live Server，然后返回再点右键就有了

如若点击右键Open with Live Server没有任何反应，请参考以下步骤

点击设置环境变量，找到系统变量Path，点击编辑

加入C:\Windows\System32

 

 重启电脑，再次打开VS code点击右键Open With Live Server就ok了

 

偷子龙衣服穿
关注
  • 7
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
搭建vue开发环境.docx
08-18
搭建vue开发环境.docx
详解VScode编辑器vue环境搭建所遇问题解决方案
10-17
主要介绍了VScode编辑器vue环境搭建所遇问题解决方案，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
VSCode调试揭秘：Live Server助力完美测试Cookie与Session，远超“Open in Browser“！
最新发布
啊猪是的读来过倒的博客
06-09 1174
适用于简单的本地文件访问，但不支持跨域Cookie和Session的处理。通过本地HTTP服务器访问文件，支持跨域Cookie和Session的处理，并提供更多的配置灵活性。对于需要测试跨域功能的开发者来说，它是一个更好的选择。所以，在开发过程中，如果需要处理跨域相关的Cookie和Session，建议使用。然而，如果你只是需要简单地查看本地HTML文件，open in browser 可能就足够了。
关于VSCode如何设置Live Server默认浏览器（Open with Live Server）
weixin_42793577的博客
03-12 1103
Open with Live Server如何设置默认浏览器 1.文件->首选项->设置 2.搜索 “live” ，找到 “Live Server › Settings: Custom Browser”
2021-09-22
baidu_40628222的博客
09-22 760
vscode设置左边代码，右边实时浏览器 1.安装扩展： live server插件。 2.设置——>用户——>扩展——>live server config ——>setting: use browser preview(勾选)。 3.安装扩展 ：browser preview插件。 4.在编辑页面右击 ------ open with live server。 注意：vscode中所有的项目事先不能通过浏览器打开，不然会提示错误，提示5500端口被占用 ...
关于VS Code中安装live server后无法正常打开浏览器，并出现Server is Started at port : 5500问题解决方案！
qq_44922199的博客
04-14 1万+
关于VS Code中安装live server后无法正常打开浏览器，并出现Server is Started at port : 5500问题解决方案！
前端开发总结
Peanutfight的博客
05-01 1307
文章目录前言一、H5开发1.vscode使用live server1.h5获取url参数二、css样式1.设置属性保持同一水平 前言 记录一下工作，学习中遇到的H5开发的小技巧~ ~ 不定期更新 一、H5开发 1.vscode使用live server 1.插件直接搜索live server安装 2.设置setting.json "liveServer.settings.donotShowInfoMsg": true, "liveServer.settings.port": 9000, //设置本地服
vscode 启用open with live server功能，配置谷歌浏览器chrome
qq350490977的专栏
08-01 4119
在免费开源的轻量级开发工具中，VScode是很多工程师的首选，无论是前端，还是后端开发，VScode配合拓展都提供了丰富的选择。选择工具区->LiveServerConfig->SettingsCustomBrowser选择chrome，即可。在扩展中输入liveserver，点击安装即可。...
vscode open with live server 打不开浏览器 显示 windows找不到‘chrome’，请确定文件名是否正确后，再试一次
qq_51955246的博客
06-13 4049
open with live server不能使用,找不到chrome文件
VSCODE添加open with code实现右键打开文件夹
10-15
在学习Vue.js或其他项目时，用户希望能够像其他人一样，直接右键点击文件夹并选择“Open with Code”以快速打开项目。 环境信息： - 操作系统：Windows 10 - VSCODE版本：v1.31.1 解决方法： 有两种解决方案： 1....
webpack4手动搭建Vue开发环境实现todoList项目的方法
10-16
本文将详细介绍如何使用webpack4手动搭建Vue开发环境，以实现一个简单的todoList项目。首先，理解webpack的基础知识至关重要，它是现代前端项目中的一个模块打包工具，能够处理JavaScript、CSS、图片等资源，将其...
详解用Docker搭建Laravel和Vue项目的开发环境
09-30
主要介绍了详解用Docker搭建Laravel和Vue项目的开发环境，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
vscode live-server使用失败解决办法
aaa10088的博客
04-28 1万+
一.直接用localhost:5500/手动打开 二.下载preview on web server 替代 去应用商店搜索preview on web server 配置preview 1）点击设置 选择设置 2）搜索 点击添加项，添加chrome或者其他浏览器 把端口改为5500 选择这个 就可以实现 页面 编辑器 同步效果。 ...
VsCode如何设置Live server默认浏览器（Open with Live Server）
axbhealj的博客
05-20 2832
VsCode如何设置liveserver打开的默认浏览器（Open with Live Server ）
vscode 设置open with live server为谷歌浏览器
热门推荐
qq_33767353的博客
10-03 1万+
1.点击扩展 ==》 设置 2. 选择扩展设置 3. 选择chrome 在页面右键点击 open with live server ,看到已是chrome浏览器打开了。
VScode open with live server和open in default browse报错打不开，windows找不到文件chrome
北枫林
07-20 1816
重新卸载再安装谷歌浏览器，然后设置成默认浏览器，然后就可以了。
vscode用open with live server找不到html文件
W666097的博客
03-22 2735
问题 Live Server是vs code中很好用的一款插件，但是可能当你下载好插件之后运行你写的html文档时（用open with Live Server这种方式），会弹出来一个错误提示框，提示Windows找不到xxx127.0.0.1html文件，我也是翻了很多篇文章，然而没能解决问题。最后也是自己琢磨出了方法，下面来分享一下我的解决方案。 解决方案 1.点击左下角的设置图标 2.找到“设置”，单击 3.在搜索框里面输入Live Server，注意右侧区域的变化，此时右侧会有选项供你勾选。
VScode当中下载liveServer后无法正常打开浏览器进行查看
qq_71552894的博客
04-02 2053
随后点击确认，重启VScode，即可正常使用liveServer插件打开浏览器查看。一、直接使用“http://127.0.0.1:5500/”进行访问。1、对liveServer插件的下载进行确认；2、尝试重新下载liveServer插件；3、对电脑Path环境变量进行修改。（5）点击Path变量，进行编辑。（3）点击下方“高级系统设置”（4）点击下方“环境变量”（2）点击下方“属性”二、通过修改环境变量。（1）打开“此电脑”
vue右键没有open with live server
08-29
抱歉，但是在Vue项目中，通常没有"右键->Open with Live Server"这个选项。这是因为Vue项目是通过命令行工具来运行和开发的。通常情况下，你需要使用以下步骤来运行Vue项目： 1. 首先，确保你已经安装了Node.js和npm（Node包管理器）。 2. 在命令行中，切换到你的Vue项目的根目录。 3. 运行以下命令来安装项目所需的依赖： ``` npm install ``` 4. 安装完成后，运行以下命令来启动开发服务器： ``` npm run serve ``` 5. 当命令行显示"App running at: http://localhost:8080/"时，表示开发服务器已经成功启动。 6. 打开你的浏览器，并在地址栏中输入http://localhost:8080/，然后按下Enter键。 7. 现在，你应该能够看到你的Vue项目在浏览器中运行了。 所以，为了在Vue项目中运行你的代码，你需要使用命令行来启动开发服务器，而不是使用"右键->Open with Live Server"这个选项。<span class="em">1</span> #### 引用[.reference_title] - *1* [MatadorDeMonstro-Game](https://download.csdn.net/download/weixin_42113794/19207148)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论 3
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值