VScode导入Vue项目
VScode导入Vue项目
1、使用VScode打开文件夹

2、找到运行按钮

3、判断有没有默认的配置文件存在

4、若文件夹存在就检查配置文件是否存在

(1)打开launch.json,把如下代码粘贴到里面的"configurations": []列表中
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
// "console": "none", // 只输出到“调试控制台”
// "console": "externalTerminal", // 外部终端调试器
"console": "integratedTerminal", // 内部终端调试器,同时输出到“调试控制台”和内置“终端”
// "console": "internalConsole", // 新版本VScode的选项,仅出输出到“调试控制台”
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}/node_modules/webpack-dev-server/bin/webpack-dev-server.js",
"args": [
"--inline",
"--progress",
"--config",
"build/webpack.dev.conf.js"
]
},
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
},
]
}

(2)运行项目

(3)停止/关闭项目

5、若文件夹不存在
(1)点击创建launch.json文件

(2)创建时会自动生成.vscode文件夹和launch.json文件

(3)打开launch.json,把如下代码粘贴到里面的"configurations": []列表中
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Launch Program",
// "console": "none", // 只输出到“调试控制台”
// "console": "externalTerminal", // 外部终端调试器
"console": "integratedTerminal", // 内部终端调试器,同时输出到“调试控制台”和内置“终端”
// "console": "internalConsole", // 新版本VScode的选项,仅出输出到“调试控制台”
"skipFiles": [
"<node_internals>/**"
],
"program": "${workspaceFolder}/node_modules/webpack-dev-server/bin/webpack-dev-server.js",
"args": [
"--inline",
"--progress",
"--config",
"build/webpack.dev.conf.js"
]
},
{
"name": "Launch Chrome",
"request": "launch",
"type": "pwa-chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}"
},
]
}

(4)运行项目

(5)停止/关闭项目

VScode导入Vue项目的更多相关文章
- VsCode调试vue项目
VsCode调试vue项目 VsCode如何调试vue项目,VsCode需要安装插件以及配置launch.json文件. 找到"扩展"或者按快捷键"Ctrl+Shift+ ...
- VSCode搭建Vue项目
在vscode上搭建一个vue项目---初学总结. 1.假设Vscode.nodejs等已经安装好了. 2.全局安装vue-cli,vue-cli可以帮助我们快速构建Vue项目. 安装命令: npm ...
- 团队协作统一vue代码风格,vscode做vue项目时的一些配置
1. 安装Vetur 扩展 主要是用于让vscode能识别vue文件,对vue代码进行高丽处理,并且它内置了一些代码格式化的设置 2. 安装ESLint 如果你的项目已经开启了eslint规范, 再有 ...
- 适用于小白:VSCode搭建Vue项目,最详细的搭建步骤哦
在vscode上搭建一个vue项目---初学总结. 1.假设Vscode.nodejs等已经安装好了. 2.全局安装vue-cli,vue-cli可以帮助我们快速构建Vue项目. 安装命令: npm ...
- vscode 开发Vue项目
写在开头 Vue作为前端项目,本身不依赖IDE,完全可以使用任何文本编辑器进行开发.我使用vscode仅是因为比较习惯,vscode几乎可以作为任何项目的开发IDE. 环境安装 安装nodejs,去官 ...
- VSCode 启动 Vue 项目 npm install 报错
1. 报错后,查看了版本. 查看node版本:node -v 查看npm版本:npm -v 查看Augular版本:ng --version 2. 感觉 Augular CLI版本太低,使用以下方 ...
- vscode 中 vue项目使用eslint插件 检查代码
前言 本文章项目由vue-cli3创建 vscode版本1.36.1 eslint1.9.0 在网上找了一大堆文章,不知是什么原因,没有一篇可以直接使用的 折腾了许久,直接按eslint插件的说明,竟 ...
- 折腾vue--使用vscode创建vue项目(二)
1.安装webpack npm install -g webpack 2.安装sass npm install --save-dev sass-loader npm install --save-de ...
- 配置VSCode开发Vue项目
一.安装VSCode.NodeJS VSCode:https://code.visualstudio.com/ NodeJS:https://nodejs.org/en/ 二.打开VSCode,安装常 ...
- vscode启动vue项目出错,给了管理员权限没用
今天在安装vue环境测试项目的时候, 发现vscode调用终端异常,语句无法运行,百度上给的解决方法是给管理员权限 给了以后发现没用,怎么试都没用,然后想到了,重启大法,然后问题就完美解决了
随机推荐
- JDBC中驱动加载的过程分析
江苏 无锡 缪小东 本篇从java.sql.Driver接口.java.sql.DriveManager类以及其它开源数据库的驱动类讨论JDBC中驱动加载的全过程以及JDBC的Framework如何做 ...
- Django之开发restful接口
django中的开发接口有两种模式FBV和CBV,分别是基于函数视图和基于类视图,详细的可以看看菜鸟教程的Django 视图 - FBV 与 CBV,由于本文的用户管理是一个restful风格的api ...
- 生产环境BigDecimal用错了,已哭晕在厕所。。。
大家好,我是苏三,又跟大家见面了. 前言 在日常开发中,很多小伙伴喜欢用 BigDecimal 来处理精确计算,比如钱.分数.比例啥的. 理论上,它比 double 或 float 更精确,但如果你用 ...
- 简化 ASP.NET Core 依赖注入(DI)注册-Scrutor
简化 ASP.NET Core 依赖注入(DI)注册-Scrutor Scrutor 是一个开源库,旨在简化 ASP.NET Core 应用程序中依赖注入(DI)的注册过程.通过自动扫描程序集中的类型 ...
- Element Plus组件v-loading在el-dialog组件上使用无效
前情 公司有经常需要做一些后台管理页面,我们选择了Element Plus,它是基于 Vue 3,面向设计师和开发者的组件库,是Vue框架生态中比较火的UI组件库,组件库丰富易用,组件链接:一个 Vu ...
- 渗透测试-前端验签绕过之SHA256+RSA
本文是高级前端加解密与验签实战的第2篇文章,本系列文章实验靶场为Yakit里自带的Vulinbox靶场,本文讲述的是绕过SHA256+RSA签名来爆破登录. 绕过 根据提示可以看出这次签名用了SHA2 ...
- tableau连接不上mysql或不显示mysql表的终极解决方法
[报错一]连不上mysql An error occurred while communicating with MySQL The connection to the data source mig ...
- 【Amadeus原创】HP惠普笔记本重装系统无法引导无法进操作系统的终极解决方法
F9进入BIOS-先进(Advanced)-安全引导配置- 启用传统支持和禁用安全引导
- CentOS7.8安装k8s
1, 安装 docker / kubelet # 在 master 节点和 worker 节点都要执行 \# 最后一个参数 1.20.6 用于指定 kubenetes 版本,支持所有 1.20.x 版 ...
- C#调用Python代码的方式(二),以PaddleOCR-GUI为例
前言 前面介绍了在C#中使用Progress类调用Python脚本的方法,但是这种方法在需要频繁调用并且需要进行数据交互的场景效果并不好,因此今天分享的是C#调用Python代码的方式(二):使用py ...