我想将一组html，css和js文件放入一个目录并打开VSCode，然后按下一个按钮运行并使用Chrome Developer工具调试前端代码并使用VSCode进行编辑 .
我还没有找到一个简单的教程来做到这一点 . 我使用gulp-webserver离完整解决方案只有几步之遥 .
我创建了两个启动选项
-
"Debug Local WebServer"启动服务器 . 但是在我的默认浏览器中打开它（不是chrome）
-
"Launch Chrome against localhost"在Chrome浏览器中打开代码（但必须先运行以前的项目才能启动Web服务器） .
我的launch.json文件：
{
"version": "0.2.0",
"configurations": [
{
"type": "node",
"request": "launch",
"name": "Debug Local Webserver",
"program": "${workspaceRoot}/node_modules/gulp/bin/gulp.js",
"args": [
"webserver"
]
},
{
"type": "chrome",
"request": "launch",
"name": "Launch Chrome against localhost",
"url": "http://localhost:8000",
"webRoot": "${workspaceRoot}"
}
]
}
我的gulpfile.js
var gulp = require('gulp'),
webserver = require('gulp-webserver');
gulp.task('default', ['webserver']);
gulp.task('webserver', function () {
gulp.src('.')
.pipe(webserver({
livereload: true,
open: true
}));
});
此方法还需要在命令行中执行以下gulp安装步骤： npm install --save-dev gulp-webserver npm install --save-dev gulp
一点点痛苦 . 一旦我弄明白该做什么，我想制作一个自耕农配置器 .
如果这一切都存在，请指点我！可以是不同的Web服务器，如果不需要Web服务器，则更好 .