github/html5-boilerplate
1
1
Fork 0
mirror of https://github.com/h5bp/html5-boilerplate.git synced 2026-01-08 22:28:10 -05:00
Code Issues Packages Projects Releases Wiki Activity

Removing jQuery (#2225)

Browse Source 
* Removing jQuery

Closes #2215

(I'll write up a super great commit message when I merge this in)

Additionally, this commit updates Modernizr (I was in the gulpfile and was reminded that they just released)
This commit is contained in:
Rob Larsen
2020-05-04 15:24:23 -04:00
committed by GitHub
parent 805d619a0d
commit 1d2b155cc5
14 changed files with 100 additions and 121 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
dist/doc/html.md vendored
View File

@@ -135,8 +135,6 @@ it before the other scripts in the bottom of the page:
```html
<script src="js/vendor/modernizr-3.10.0.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js"></script>
<script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.5.0.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
</body>
@@ -154,7 +152,33 @@ The only thing Modernizr does regarding polyfills is that the team maintains [a
huge list of cross Browser
polyfills](https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills).
### jQuery CDN for jQuery
### jQuery
As of v8.0.0 we no longer include jQuery by default. Web development has
changed a lot since we started this project and while many millions of sites
still use jQuery there are many sites and applications that don't. 10 years ago
jQuery _was_ JavaScript for most developers. That's not the case any more so
we've made the decision to remove jQuery from the project.
If you're interested in including it, you can easily install jQuery using the
following command:
```
npm install jQuery
```
You can then copy the minified file into the `vendor` folder and add jQuery
to the `index.html` manually.
For reference the last version of the snippet we used to include jQuery looked
like the following:
``` html
<script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.5.0.min.js"><\/script>')</script>
```
#### jQuery CDN for jQuery
The jQuery CDN version of the jQuery JavaScript library is referenced towards
the bottom of the page. A local fallback of jQuery is included for rare

2
dist/doc/js.md vendored
View File

@@ -29,7 +29,7 @@ function, thus, preventing the browser from throwing an error.
This directory can be used to contain all 3rd party library code.
Minified versions of the latest jQuery and Modernizr libraries are included by
Our custom build of the Modernizr library is included by
default. You may wish to create your own [custom Modernizr build with the online
builder](https://modernizr.com/download/) or [command line
tool](https://modernizr.com/docs#command-line-config).

4
dist/index.html vendored
View File

@@ -21,9 +21,7 @@
<!-- Add your site or application content here -->
<p>Hello world! This is HTML5 Boilerplate.</p>
<script src="js/vendor/modernizr-3.10.0.min.js"></script>
<script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.5.0.min.js"><\/script>')</script>
<script src="js/vendor/modernizr-3.11.0.min.js"></script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>

2
dist/js/vendor/jquery-3.5.0.min.js vendored
View File

File diff suppressed because one or more lines are too long

3
dist/js/vendor/modernizr-3.10.0.min.js vendored
View File

File diff suppressed because one or more lines are too long

3
dist/js/vendor/modernizr-3.11.0.min.js vendored Normal file
View File

File diff suppressed because one or more lines are too long

17
gulpfile.babel.js
View File

@@ -10,7 +10,6 @@ import plugins from 'gulp-load-plugins';
import archiver from 'archiver';
import glob from 'glob';
import del from 'del';
import ssri from 'ssri';
import modernizr from 'modernizr';
import pkg from './package.json';
@@ -75,26 +74,14 @@ gulp.task('copy:.htaccess', () =>
);
gulp.task('copy:index.html', () => {
const hash = ssri.fromData(
fs.readFileSync('node_modules/jquery/dist/jquery.min.js'),
{ algorithms: ['sha256'] }
);
let version = pkg.devDependencies.jquery;
let modernizrVersion = pkg.devDependencies.modernizr;
return gulp.src(`${dirs.src}/index.html`)
.pipe(plugins().replace(/{{JQUERY_VERSION}}/g, version))
.pipe(plugins().replace(/{{MODERNIZR_VERSION}}/g, modernizrVersion))
.pipe(plugins().replace(/{{JQUERY_SRI_HASH}}/g, hash.toString()))
.pipe(gulp.dest(dirs.dist));
});
gulp.task('copy:jquery', () =>
gulp.src(['node_modules/jquery/dist/jquery.min.js'])
.pipe(plugins().rename(`jquery-${pkg.devDependencies.jquery}.min.js`))
.pipe(gulp.dest(`${dirs.dist}/js/vendor`))
);
gulp.task('copy:license', () =>
gulp.src('LICENSE.txt')
.pipe(gulp.dest(dirs.dist))
@@ -133,6 +120,7 @@ gulp.task('copy:normalize', () =>
gulp.task('modernizr', (done) => {
modernizr.build(modernizrConfig, (code) => {
fs.mkdirSync(`${dirs.dist}/js/vendor/`);
fs.writeFile(`${dirs.dist}/js/vendor/modernizr-${pkg.devDependencies.modernizr}.min.js`, code, done);
});
});
@@ -153,7 +141,6 @@ gulp.task(
gulp.series(
'copy:.htaccess',
'copy:index.html',
'copy:jquery',
'copy:license',
'copy:main.css',
'copy:misc',

111
package-lock.json generated
View File

@@ -5117,12 +5117,6 @@
"reusify": "1.0.4"
}
},
"figgy-pudding": {
"version": "3.5.1",
"resolved": "http://artifactory/artifactory/api/npm/npm/figgy-pudding/-/figgy-pudding-3.5.1.tgz",
"integrity": "sha1-hiRwESkBxyeg5JWoB0S9W6odZ5A=",
"dev": true
},
"figures": {
"version": "2.0.0",
"resolved": "http://artifactory/artifactory/api/npm/npm/figures/-/figures-2.0.0.tgz",
@@ -7181,12 +7175,6 @@
"textextensions": "2.4.0"
}
},
"jquery": {
"version": "3.5.0",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.5.0.tgz",
"integrity": "sha512-Xb7SVYMvygPxbFMpTFQiHh1J7HClEaThguL15N/Gg37Lri/qKyhRGZYzHRyLH8Stq3Aow0LsHO2O2ci86fCrNQ==",
"dev": true
},
"js-tokens": {
"version": "4.0.0",
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
@@ -7608,15 +7596,6 @@
"integrity": "sha1-hX/Kv8M5fSYluCKCYuhqp6ARsF0=",
"dev": true
},
"minipass": {
"version": "3.1.1",
"resolved": "http://artifactory/artifactory/api/npm/npm/minipass/-/minipass-3.1.1.tgz",
"integrity": "sha1-dgfOd4RyoYWtbYkIKqIHD3nO3NU=",
"dev": true,
"requires": {
"yallist": "4.0.0"
}
},
"mixin-deep": {
"version": "1.3.2",
"resolved": "https://registry.npmjs.org/mixin-deep/-/mixin-deep-1.3.2.tgz",
@@ -7755,9 +7734,9 @@
}
},
"modernizr": {
"version": "3.10.0",
"resolved": "https://registry.npmjs.org/modernizr/-/modernizr-3.10.0.tgz",
"integrity": "sha512-ckbj+oUvkQ1NfKH4fuejIidP2HIwHMMQm2czSOWSjlv9LbWPC7gDYk8phXvEO52GJjZre6iODvK84+KEStqpzw==",
"version": "3.11.0",
"resolved": "https://registry.npmjs.org/modernizr/-/modernizr-3.11.0.tgz",
"integrity": "sha512-OyuUo36z5zwpKJ3TdO0pAWIvgLF4AJEA1WCHimZEoG8ljTJCfi/55omaTd9QJxftaBnjcKGi2bDahg8gBhMRFg==",
"dev": true,
"requires": {
"doctrine": "3.0.0",
@@ -7781,8 +7760,8 @@
"integrity": "sha512-9VGjrMsG1vePxcSweQsN20KY/c4zN0h9fLjqAbwbPfahM3t+NL+M9HC8xeXG2I8pX5NoamTGNuomEUFI7fcUjA==",
"dev": true,
"requires": {
"@types/color-name": "1.1.1",
"color-convert": "2.0.1"
"@types/color-name": "^1.1.1",
"color-convert": "^2.0.1"
}
},
"cliui": {
@@ -7791,9 +7770,9 @@
"integrity": "sha512-t6wbgtoCXvAzst7QgXxJYqPt0usEfbgQdftEPbLL/cvv6HPE5VgvqCuAIDR0NgU52ds6rFwqrgakNLrHEjCbrQ==",
"dev": true,
"requires": {
"string-width": "4.2.0",
"strip-ansi": "6.0.0",
"wrap-ansi": "6.2.0"
"string-width": "^4.2.0",
"strip-ansi": "^6.0.0",
"wrap-ansi": "^6.2.0"
}
},
"color-convert": {
@@ -7802,7 +7781,7 @@
"integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
"dev": true,
"requires": {
"color-name": "1.1.4"
"color-name": "~1.1.4"
}
},
"color-name": {
@@ -7817,7 +7796,7 @@
"integrity": "sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==",
"dev": true,
"requires": {
"esutils": "2.0.2"
"esutils": "^2.0.2"
}
},
"emoji-regex": {
@@ -7832,8 +7811,8 @@
"integrity": "sha512-PpOwAdQ/YlXQ2vj8a3h8IipDuYRi3wceVQQGYWxNINccq40Anw7BlsEXCMbt1Zt+OLA6Fq9suIpIWD0OsnISlw==",
"dev": true,
"requires": {
"locate-path": "5.0.0",
"path-exists": "4.0.0"
"locate-path": "^5.0.0",
"path-exists": "^4.0.0"
}
},
"is-fullwidth-code-point": {
@@ -7848,7 +7827,7 @@
"integrity": "sha512-t7hw9pI+WvuwNJXwk5zVHpyhIqzg2qTlklJOf0mVxGSbe3Fp2VieZcduNYjaLDoy6p9uGpQEGWG87WpMKlNq8g==",
"dev": true,
"requires": {
"p-locate": "4.1.0"
"p-locate": "^4.1.0"
}
},
"minimist": {
@@ -7863,7 +7842,7 @@
"integrity": "sha512-NKmAlESf6jMGym1++R0Ra7wvhV+wFW63FaSOFPwRahvea0gMUcGUhVeAg/0BC0wiv9ih5NYPB1Wn1UEI1/L+xQ==",
"dev": true,
"requires": {
"minimist": "1.2.5"
"minimist": "^1.2.5"
}
},
"p-limit": {
@@ -7872,7 +7851,7 @@
"integrity": "sha512-//88mFWSJx8lxCzwdAABTJL2MyWB12+eIY7MDL2SqLmAkeKU9qxRvWuSyTjm3FUmpBEMuFfckAIqEaVGUDxb6w==",
"dev": true,
"requires": {
"p-try": "2.2.0"
"p-try": "^2.0.0"
}
},
"p-locate": {
@@ -7881,7 +7860,7 @@
"integrity": "sha512-R79ZZ/0wAxKGu3oYMlz8jy/kbhsNrS7SKZ7PxEHBgJ5+F2mtFW2fK2cOtBh1cHYkQsbzFV7I+EoRKe6Yt0oK7A==",
"dev": true,
"requires": {
"p-limit": "2.3.0"
"p-limit": "^2.2.0"
}
},
"p-try": {
@@ -7902,9 +7881,9 @@
"integrity": "sha512-zUz5JD+tgqtuDjMhwIg5uFVV3dtqZ9yQJlZVfq4I01/K5Paj5UHj7VyrQOJvzawSVlKpObApbfD0Ed6yJc+1eg==",
"dev": true,
"requires": {
"emoji-regex": "8.0.0",
"is-fullwidth-code-point": "3.0.0",
"strip-ansi": "6.0.0"
"emoji-regex": "^8.0.0",
"is-fullwidth-code-point": "^3.0.0",
"strip-ansi": "^6.0.0"
}
},
"strip-ansi": {
@@ -7913,7 +7892,7 @@
"integrity": "sha512-AuvKTrTfQNYNIctbR1K/YGTR1756GycPsg7b9bdV9Duqur4gv6aKqHXah67Z8ImS7WEz5QVcOtlfW2rZEugt6w==",
"dev": true,
"requires": {
"ansi-regex": "5.0.0"
"ansi-regex": "^5.0.0"
}
},
"wrap-ansi": {
@@ -7922,9 +7901,9 @@
"integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
"dev": true,
"requires": {
"ansi-styles": "4.2.1",
"string-width": "4.2.0",
"strip-ansi": "6.0.0"
"ansi-styles": "^4.0.0",
"string-width": "^4.1.0",
"strip-ansi": "^6.0.0"
}
},
"yargs": {
@@ -7933,23 +7912,23 @@
"integrity": "sha512-92O1HWEjw27sBfgmXiixJWT5hRBp2eobqXicLtPBIDBhYB+1HpwZlXmbW2luivBJHBzki+7VyCLRtAkScbTBQA==",
"dev": true,
"requires": {
"cliui": "6.0.0",
"decamelize": "1.2.0",
"find-up": "4.1.0",
"get-caller-file": "2.0.5",
"require-directory": "2.1.1",
"require-main-filename": "2.0.0",
"set-blocking": "2.0.0",
"string-width": "4.2.0",
"which-module": "2.0.0",
"y18n": "4.0.0",
"yargs-parser": "18.1.2"
"cliui": "^6.0.0",
"decamelize": "^1.2.0",
"find-up": "^4.1.0",
"get-caller-file": "^2.0.1",
"require-directory": "^2.1.1",
"require-main-filename": "^2.0.0",
"set-blocking": "^2.0.0",
"string-width": "^4.2.0",
"which-module": "^2.0.0",
"y18n": "^4.0.0",
"yargs-parser": "^18.1.1"
}
},
"yargs-parser": {
"version": "18.1.2",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.2.tgz",
"integrity": "sha512-hlIPNR3IzC1YuL1c2UwwDKpXlNFBqD1Fswwh1khz5+d8Cq/8yc/Mn0i+rQXduu8hcrFKvO7Eryk+09NecTQAAQ==",
"version": "18.1.3",
"resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-18.1.3.tgz",
"integrity": "sha512-o50j0JeToy/4K6OZcaQmW6lyXXKhq7csREXcDwk2omFPJEwUNOVtJKvmDr9EI1fAJZUyZcRF7kxGBWmRXudrCQ==",
"dev": true,
"requires": {
"camelcase": "5.3.1",
@@ -9336,16 +9315,6 @@
"integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
"dev": true
},
"ssri": {
"version": "7.1.0",
"resolved": "http://artifactory/artifactory/api/npm/npm/ssri/-/ssri-7.1.0.tgz",
"integrity": "sha1-ksJBv23oI2W1x/tL126XVSLhKU0=",
"dev": true,
"requires": {
"figgy-pudding": "3.5.1",
"minipass": "3.1.1"
}
},
"stack-trace": {
"version": "0.0.10",
"resolved": "https://registry.npmjs.org/stack-trace/-/stack-trace-0.0.10.tgz",
@@ -10348,12 +10317,6 @@
"integrity": "sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w==",
"dev": true
},
"yallist": {
"version": "4.0.0",
"resolved": "http://artifactory/artifactory/api/npm/npm/yallist/-/yallist-4.0.0.tgz",
"integrity": "sha1-m7knkNnA7/7GO+c1GeEaNQGaOnI=",
"dev": true
},
"yargs": {
"version": "13.3.2",
"resolved": "https://registry.npmjs.org/yargs/-/yargs-13.3.2.tgz",

4
package.json
View File

@@ -38,12 +38,10 @@
"gulp-load-plugins": "^2.0.3",
"gulp-rename": "^1.4.0",
"gulp-replace": "^1.0.0",
"jquery": "3.5.0",
"main.css": "2.0.0",
"mocha": "^6.2.3",
"modernizr": "3.10.0",
"modernizr": "3.11.0",
"normalize.css": "8.0.1",
"ssri": "^7.1.0",
"strip-json-comments": "^3.1.0"
},
"engines": {

30
src/doc/html.md
View File

@@ -135,8 +135,6 @@ it before the other scripts in the bottom of the page:
```html
<script src="js/vendor/modernizr-3.10.0.min.js"></script>
<script src="https://polyfill.io/v3/polyfill.min.js"></script>
<script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.5.0.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>
</body>
@@ -154,7 +152,33 @@ The only thing Modernizr does regarding polyfills is that the team maintains [a
huge list of cross Browser
polyfills](https://github.com/Modernizr/Modernizr/wiki/HTML5-Cross-Browser-Polyfills).
### jQuery CDN for jQuery
### jQuery
As of v8.0.0 we no longer include jQuery by default. Web development has
changed a lot since we started this project and while many millions of sites
still use jQuery there are many sites and applications that don't. 10 years ago
jQuery _was_ JavaScript for most developers. That's not the case any more so
we've made the decision to remove jQuery from the project.
If you're interested in including it, you can easily install jQuery using the
following command:
```
npm install jQuery
```
You can then copy the minified file into the `vendor` folder and add jQuery
to the `index.html` manually.
For reference the last version of the snippet we used to include jQuery looked
like the following:
``` html
<script src="https://code.jquery.com/jquery-3.5.0.min.js" integrity="sha256-xNzN2a4ltkB44Mc/Jz3pT4iU1cmeR0FkXs4pru/JxaQ=" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-3.5.0.min.js"><\/script>')</script>
```
#### jQuery CDN for jQuery
The jQuery CDN version of the jQuery JavaScript library is referenced towards
the bottom of the page. A local fallback of jQuery is included for rare

2
src/doc/js.md
View File

@@ -29,7 +29,7 @@ function, thus, preventing the browser from throwing an error.
This directory can be used to contain all 3rd party library code.
Minified versions of the latest jQuery and Modernizr libraries are included by
Our custom build of the Modernizr library is included by
default. You may wish to create your own [custom Modernizr build with the online
builder](https://modernizr.com/download/) or [command line
tool](https://modernizr.com/docs#command-line-config).

2
src/index.html
View File

@@ -22,8 +22,6 @@
<!-- Add your site or application content here -->
<p>Hello world! This is HTML5 Boilerplate.</p>
<script src="js/vendor/modernizr-{{MODERNIZR_VERSION}}.min.js"></script>
<script src="https://code.jquery.com/jquery-{{JQUERY_VERSION}}.min.js" integrity="{{JQUERY_SRI_HASH}}" crossorigin="anonymous"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-{{JQUERY_VERSION}}.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/main.js"></script>

10
test/file_content.js
View File

@@ -56,16 +56,6 @@ function runTests() {
checkString(path.resolve(dir, '.htaccess'), string, done);
});
it('"index.html" should contain the correct jQuery version in the CDN URL', (done) => {
const string = `code.jquery.com/jquery-${pkg.devDependencies.jquery}.min.js`;
checkString(path.resolve(dir, 'index.html'), string, done);
});
it('"index.html" should contain the correct jQuery version in the local URL', (done) => {
const string = `js/vendor/jquery-${pkg.devDependencies.jquery}.min.js`;
checkString(path.resolve(dir, 'index.html'), string, done);
});
it('"index.html" should contain the correct Modernizr version in the local URL', (done) => {
const string = `js/vendor/modernizr-${pkg.devDependencies.modernizr}.min.js`;
checkString(path.resolve(dir, 'index.html'), string, done);

1
test/file_existence.js
View File

@@ -49,7 +49,6 @@ const expectedFilesInDistDir = [
'js/main.js',
'js/plugins.js',
'js/vendor/',
`js/vendor/jquery-${pkg.devDependencies.jquery}.min.js`,
`js/vendor/modernizr-${pkg.devDependencies.modernizr}.min.js`,
'LICENSE.txt',