Migrate to Webpack & ES6 modules

[Neo-Zhixing]

Fixes: #277

• Check the commit's or even all commits' message styles matches our requested structure.
• Check your code additions will not fail unit test.
• Check your code additions will not fail code linting checks.
  Indentation was intentionally kept the way it originally was to minimize changes. Automatic formatting could be done at some point in the future.

Short description of what this resolves:

Removed Grunt and enabled Webpack
Migrate the code base to use ES6 modules

Proposed changes:

Further refactor the code base and progressively make everything ES6

[Neo-Zhixing]

Currently the bundled umd module has a size of more than 600KB. Work is needed to eliminate some of the dependencies from the build.

[codecov]

Codecov Report

Merging #325 into develop will not change coverage.
The diff coverage is 100%.

@@          Coverage Diff           @@
##           develop   #325   +/-   ##
======================================
  Coverage      100%   100%           
======================================
  Files            1      1           
  Lines            1      1           
  Branches         0      1    +1     
======================================
  Hits             1      1

Impacted Files	Coverage Δ
dist/htmlhint.js	100% <100%> (ø)

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 8a37bc2...1022e4b. Read the comment docs.

[Arcanemagus]

This completely broke the Node.js API, with no changelog entry, no release notes on the release, and most importantly no update to the documentation.

It looks like now the HTMLHint being exported is a Class instead of a function, meaning we need to instantiate it.
Before and the documentation:

var HTMLHint  = require("htmlhint").HTMLHint;
var messages = HTMLHint.verify('<ul><li></ul>', {'tag-pair': true});

Now:

var HTMLHintClass  = require("htmlhint").HTMLHint;
var HTMLHint = new HTMLHintClass();
var messages = HTMLHint.verify('<ul><li></ul>', {'tag-pair': true});

However this appears to return an empty array no matter what I feed it, so something else has changed as well.

Breaking changes are okay as long as they are clearly communicated, this is an example of how not to do them.

[thedaviddias]

Hi @Arcanemagus, thanks to point that out, we were planning to fix these issues after the weekend where students worked on the project during Hackillinois.

We communicated on the discord channel about but be sure another release will be done in the next days to fix that.

It was an opportunity for students to work on open-source projects and yes, it comes with mistakes but we were aware of that. Thanks again.

[Arcanemagus]

Glad to hear it! I'll check back when AtomLinter/linter-htmlhint#197 updates 😉.

[thedaviddias]

By the way, they won the prize for "the best contribution to a code review tool" 🙌

[Arcanemagus]

Reminder that the currently released version of the package is still broken 😉.

[Arcanemagus]

The currently released version (v0.11.0) is still broken.

[Arcanemagus]

The current release still hasn't been fixed, or the documentation updated to match whatever the new behavior is. 🤷‍♂

[Arcanemagus]

For anyone else coming to this, it looks like this is the new way to get a working HTMLHint.verify:

const htmlhintModule = require('htmlhint');
const HTMLHint = new htmlhintModule.HTMLHint();
Object.keys(htmlhintModule.HTMLRules).forEach((rule) => {
  HTMLHint.addRule(htmlhintModule.HTMLRules[rule]);
});

Taken from the code used here to generate what you get at require('htmlhint').default.