开始第一个前端程序

使用"debugger for firefox" 插件调试

对应的launch.json修改为本地可用，能用再说，不管细节。

{
    // 使用 IntelliSense 了解相关属性。 
    // 悬停以查看现有属性的描述。
    // 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387
    "version": "0.2.0",
    "configurations": [
        {
            "name": "Launch index.html",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "file": "${workspaceFolder}/index.html",
            "profile": "default",
            "firefoxExecutable": "D:/program/MozillaFirefox/firefox.exe",
            "firefoxArgs": ["-start-debugger-server", "-no-remote"],
    "log": {
      "consoleLevel": {
        "PathConversion": "Warn",
        "default": "Warn"
      }
    }
        },
        {
            "name": "Launch localhost",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "url": "http://localhost/index.html",
            "webRoot": "${workspaceFolder}",
            "profile": "default",
            "firefoxExecutable": "D:/program/MozillaFirefox/firefox.exe",
            "firefoxArgs": ["-start-debugger-server", "-no-remote"],
    "log": {
      "consoleLevel": {
        "PathConversion": "Warn",
        "default": "Warn"
      }
    }        },
        {
            "name": "Attach",
            "type": "firefox",
            "request": "attach"
        },
        {
            "name": "Launch addon",
            "type": "firefox",
            "request": "launch",
            "reAttach": true,
            "addonType": "webExtension",
            "addonPath": "${workspaceFolder}",
            "profile": "default",
            "firefoxExecutable": "D:/program/MozillaFirefox/firefox.exe",
            "firefoxArgs": ["-start-debugger-server", "-no-remote"],
    "log": {
      "consoleLevel": {
        "PathConversion": "Warn",
        "default": "Warn"
      }
    }
        }
    ]
}

建立 test1/index.html

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <title>
开始显示一个标题
        </title>
    </head>

    <body>
        <article>
            <header>
                <h1>
                    这是我显示的第一个内容
                </h1>
            </header>
            <p>
                具体内容如下。开始h5开发。前端开发比app有意思.
            </p>
        </article>
    </body>
</html>

调试——>用firefox调试

开始第一个前端程序

猜你喜欢