index.md

User guide

Getting started

If you want to have an idea of what webhint does and you have an updated version of npm (v5.2.0) and Node.js LTS (v8.9.2) or later, x64 version recommended you can use the following command:

npx hint https://example.com

The recommended way of running webhint is as a devDependency of your project.

npm install hint --save-dev

And then add a script task to your package.json:

{
    ...
    "scripts": {
        "webhint": "hint http://localhost:8080"
    }
}

And run it via:

npm run webhint

You can also run webhint from within VS Code and as a browser extension.

NOTE: If you run into any issues during the install process please check the troubleshoot section.

webhint needs a configuration file to know what hints, connectors, etc. to use. By default it will look for a .hintrc file in the current folder and then in the user's home directory. If none is found, it will use a built-in default configuration and warn the user about it.

The recommended way to create the configuration file is by running:

npm create hintrc

This command will start a wizard that will ask you a series of questions (e.g.: do you want to use a predefined configuration or prefer to create one with the installed resource, what connector to use, formatter, hints, etc.). Answer them and you will end up with something similar to the following if you decided to use a predefined configuration:

{
    "extends": ["configurationName"]
}

or the following if custom:

{
    "connector": {
        "name": "connectorName"
    },
    "formatters": ["formatterName"],
    "hints": {
        "hint1": "error",
        "hint2": "warning",
        "hint3": "off"
    },
    "hintsTimeout": 120000
    ...
}

Then you have to run the following command to scan a website:

hint https://example.com

Wait a few seconds and you will get something similar to the following:

It might take a few minutes to get some of the results. Some of the hints (e.g.: SSL Labs) can take a few minutes to report the results.

Default configuration

To run webhint you need a .hintrc file. If you do not have one, webhint will use the web-recommended set of hints to analyze an URL or development if you are analyzing an existing directory or file in your filesystem. This configuration will be equivalent to the following .hintrc:

{
    "extends": ["web-recommended"]
}

or

{
    "extends": ["development"]
}

Further reading

Now that you have webhint up and running, it is time to learn a bit more about the different pieces:

• Hints
• Configurations
• Connectors
• Formatters
• Parsers