疑难杂症——如何利用vscode运行vue前端项目

最新推荐文章于 2024-06-05 12:05:46 发布
最新推荐文章于 2024-06-05 12:05:46 发布
阅读量1.3w 收藏 33
点赞数 5
分类专栏： 疑难杂症 文章标签： web vue java visual studio code node.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xdk2166/article/details/107954816
版权

如何利用vscode运行vue前端项目

vscode运行vue前端项目

vscode下载

vscode切换中文

1.使用快捷键组合【Ctrl+Shift+p】，打开搜索框，输入“configure display language”
在这里插入图片描述
在这里插入图片描述
2.没切换中文之前，是没有中文选项的，需要安装中文插件，点击安装其他语言，选择简体中文安装插件
在这里插入图片描述

导入vue项目

1.选择文件—打开文件—选择要导入的vue项目文件夹

2.安装vutur插件，此插件为vue代码高亮插件，选择安装插件

安装node.js

最低0.47元/天 解锁文章
一剑浪天涯
关注
  • 5
    点赞
  • 踩
  • 33
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
专栏目录
疑难杂症——宾语前置句判断标志整理.pdf
11-17
疑难杂症——宾语前置句判断标志整理 在学习汉语语法时，宾语前置句是一个常见的难点。那么，什么是宾语前置句？如何判断宾语前置句呢？本文将对宾语前置句的判断标志进行整理和分析。 一、疑问代词作为宾语前置句...
前端-VScode安装和使用(1)
2401_84447149的博客
04-27 348
安装服务器Liver server。类似于tomcat,可以模拟出tomcat类似效果。安装 vetur。vue开发工具，安装后更方便vue的使用。vue-helper。方便vue操作注意：插件安装完成后需要重启vscode2.2、设置字体大小左边栏 管理-> 设置-> 搜索 “font” -> Font size修改完后ctrl+s保存。2.3、开启完整的Emmet语法支持设置中搜索 Emmet：启用如下选项，必要时重启vs3、创建项目3.1、创建空的文件夹。
三、使用VSCode运行vue项目（VSCode插件设置）
weixin_45681674的博客
08-10 2万+
前言1. 打开VSCode1. 下载vetur插件2. 下载eslint插件3. Auto Close Tag 自动闭合HTML/XML标签4. Debugger for Chrome2. 打开vue项目 1. 打开VSCode 1. 下载vetur插件 该插件是vue文件基本语法的高亮插件，在插件窗口中输入vetur点击安装插件就行， 装好后 点击文件->首选项->设置 ->打开设置 界面，在设置界面右侧添加配置。 "emmet.syntaxProfiles": {
VSCode部署前端代码程序包到本地运行
最新发布
2401_84827689的博客
06-05 191
2.在这时可能会遇到报错，报错的解决方法如下,在windows自带的搜索框中搜索Windows PowerShell,以管理员身份运行。8.如果前面的都没问题，那要检查config.js文件的Url,询问后端人员网址有没有错误，如有更新就要更改保存后再执行上面第6步。3.在命令行窗口中输入set-ExecutionPolicy RemoteSigned,按回车，改变执行策略，输入Y。1.在终端打开该项目，输入npm install -g yarn,按回车。7.跑完代码后会弹出对应的网址，点击进入即可。
使用VS Code运行前端代码
二哈喇子！
07-06 6171
使用VS Code运行HTML文件
VS code运行vue项目
各类程序设计成品、文档、学习资料
10-25 2万+
请注意，以上步骤假设您的Vue项目已经配置好了相应的构建脚本（如package.json中的"scripts"字段）。命令时出现"无法将'npm'项识别为cmdlet、函数、脚本文件或可运行程序的名称"的错误消息，这可能是因为您的计算机上没有正确安装Node.js和npm，或者系统环境变量配置不正确。2.在VS Code的侧边栏中，选择您的Vue项目文件夹，或者使用菜单中的“文件”->“打开文件夹”选项来打开项目文件夹。3.打开终端（菜单中的“视图”->“终端”），确保终端位于您的Vue项目文件夹下。
前端学习之一——关于第一次使用VSCode打开前端代码并启动问题
Jupite_ch的博客
05-25 1万+
注意：所有涉及代码的软件，都不建议使用中文目录！！要不然会出事！！勿谓言之不预！ 如果不小心用了，后期出现问题，就要重装了。 一、软件环境准备（VSCode、git、nodejs、npm） 1、VSCode下载安装教程 下载： 官网网址：https://code.visualstudio.com/Download ​我是直接点这里。然后它的下载速度会很慢。这时候把下载任务的链接复制出来，将里面的 http://az764295.vo.msecnd.net 替换为 http://v..
使用vscode运行Vue项目
someday____的博客
08-31 2万+
检查安装情况：打开cmd，依次输入node -v 和 npm -v，查看到版本号，则安装成功。代表开始运行项目，这条命令会自动在浏览器上运行项目，运行结果如下图所示，代表配置成功了。点击(ctrl+点击)网址http://localhost:80/，可得运行结果。使用vscode运行别人工程里的vue项目。用vscode打开vue项目。呼出控制台，在控制台点击。...
创建基于vue2的vue-cli及运行，vue.js官网样例如何在vscode上运行（如何应对报错情况的三种解决方式）
m0_56905968的博客
11-12 2086
如何创建vue-cli脚手架并创建vue2版本，创建成功后运行vue-cli的方法，vue.js官网如何在vscode上运行
把脉linux的疑难杂症
01-19
你只会windows？你真是OUT了，身为电脑开发者或者嵌入式设计的工程师而言学习linux是非常重要的。学习任何东西都是需要简化的步骤，看透彻规律，我在学习linux过程中觉得linux对于分区的要求以及命名，是重要的，...
windows安装卸载疑难杂症解决包
10-19
通过运行这个诊断程序，用户可以让系统自动检测和解决安装或卸载过程中的一些常见问题。通常，这种诊断工具会提供用户界面来引导用户进行一些步骤，以便帮助用户解决安装或卸载过程中可能出现的错误或故障。
以COM对象处理Excel疑难杂症
07-21
处理Excel疑难杂症时，可能会遇到以下几种情况： 1. **错误处理**：在使用COM对象时，可能会遇到文件已被其他进程占用、路径错误等问题。我们需要捕获并处理这些异常，确保程序的稳定运行。 2. **性能优化**：大量...
浅析电脑疑难杂症 jp.docx
10-13
浅析电脑疑难杂症
使用vscode运行vue项目
热门推荐
xw_009的博客
04-07 10万+
！！学习完vue环境搭建并创建项目后下面我们介绍使用vscode运行vue项目。！！ 文章参考：https://www.csdn.net/gather_29/OtTagg3sNzA2LWJsb2cO0O0O.html 一：下载vscode地址为：https://code.visualstudio.com/ 然后根据自己的电脑下载对应的版本，我的是Windows X64。 二：语言的修改（Visu...
vscode使用教程-开始学习前端开发啦~
Magnolia_He的博客
09-11 1万+
这里写自定义目录标题用户配置用户界面VSCode的基本布局：项目的新建与引入主题设置颜色主题图标主题用户和工作区设置用户和工作区的差别快捷键设置Git配置什么是GitGit的下载与安装GitGitHub新建仓库Git的基本操作1.clone 远程仓库2.添加文件3.提交commit如何改变文本的样式生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图
Vs Code配置前端环境及运行
m0_61216015的博客
10-22 1万+
如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章，了解一下Markdown的基本语法知识。4.需要安装谷歌浏览器来进行运行代码并调试bug，谷歌浏览器中需要安装vue开发者工具，以便随时查看数据，DOM结构以及调试。3.需要安装git以便于下载代码到本地以及管理代码，企业管理代码时需要用到gitlab。2.安装node.js来使用npm，还需要安装淘宝镜像方便快速使用npm导入插件；安装下图的插件即可，我这里已经安装好了。里搜索Live Server，然后安装。，在搜索栏里搜索npm。
VSCode如何运行Vue项目
m0_46627730的博客
11-10 1万+
前言 以前都是用webstorm编写前端代码，最近开始尝试使用VSCode来写，目前还是有些懵逼的，一步步将使用流程写下来便于之后自己再次配置。 具体流程： 1：首先还是需要我们利用vue-cli脚手架搭建空vue项目，这个我就不赘述了 2：打开VSCode下载vetur插件 点击左侧圈起来的图标打开拓展插件，在顶部搜索框搜索vetur插件进行下载安装即可。 下载安装完后就会在扩展列表那看到，例如我的是0.29.1版本的 之后需要打开setting.json文件进行配置： "emmet.syntaxPr
vscode运行起vue项目的全过程，包括npm安装
lamxin的博客
02-22 3万+
https://blog.csdn.net/ywl570717586/article/details/79754543 首先，是按照上述步骤进行，发现未安装npm,于是跑去安装npm,结果一直出现Invalid drive的错误，发现自己以前装过nodejs在F盘，后来又重装系统没有了F盘，所以之前的nodejs还在，但不能用，卸载时也会出现同样的问题，我找到了以下方法https://blog....
使用 vscode 导入现有的 vue 项目进行开发的操作步骤 前端初体验
huqiankunlol的博客
07-24 1万+
现在大部分项目都是前后端分离的开发模式，前端接触的越太少了，记录一下个人开发 vue 项目的过程 首先项目是直接从开源社区下载下来的，我这里下载的是 若依的开源项目 使用 vscode 开发要装 node.js ,我们进行管网下载既可 安装的过程默认既可，无需什么配置，接下来我们打开 vscode 工具 , 文件 - 打开文件夹 ，选择项目所在的路径 按 Ctrl + ~ 键 ( Esc 下面的那个 ) 调出终端 ，执行 install 这个过程有点慢，执行完成后，...
单元格值_疑难杂症——eltable单元格使用输入框时无法输入值
05-25
这个问题可能是由于使用了 `el-input` 组件作为单元格的编辑器，但没有正确配置其 `v-model` 绑定值。以下是一种可能的解决方法： 1. 确保 `el-input` 组件的 `v-model` 绑定值正确绑定到单元格的数据字段上。例如，如果您的数据对象中有一个 `name` 字段，可以这样定义编辑器： ``` <template slot-scope="scope"> <el-input v-model="scope.row.name"></el-input> </template> ``` 2. 如果您的表格是可编辑的（即设置了 `:edit-config="{trigger: 'click', mode: 'cell'}"`），则需要在 `el-table` 标签上添加 `@edit-closed="handleEditClosed"` 事件监听器，并在 `handleEditClosed` 方法中手动触发表格的更新： ``` <el-table :data="tableData" :edit-config="{trigger: 'click', mode: 'cell'}" @edit-closed="handleEditClosed"> <!-- ... --> </el-table> <script> export default { // ... methods: { handleEditClosed({ row, column, cell }) { this.$nextTick(() => { this.$refs.table.updateCell(row, column); }); }, }, }; </script> ``` 这是因为 `el-table` 内部使用了虚拟 DOM 技术，编辑器的值修改后可能无法自动触发表格的更新。手动调用 `updateCell` 方法可以强制更新单元格的显示内容。 希望这些信息对您有所帮助！

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值