web 3d图形渲染器
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

121 lines
3.2 KiB

  1. # native-url
  2. A lightweight implementation of Node's [url](http://nodejs.org/api/url.html) interface atop the [URL API](https://developer.mozilla.org/en-US/docs/Web/API/URL). Use it instead of the `url` module to reduce your bundle size by around 7.5 kB.
  3. Weighs **1.6 kB gzipped**, works in Node.js 7+ and [all modern browsers](https://caniuse.com/#feat=mdn-api_url):
  4. ![Chrome 32, Firefox 19, Safari 7, Edge 12, Opera 19](https://badges.herokuapp.com/browsers?googlechrome=32&firefox=19&safari=7&microsoftedge=12&opera=19)
  5. Older browsers can be [easily polyfilled](#polyfill-for-older-browsers) without new browsers loading the code.
  6. ## Installation
  7. ```sh
  8. npm i native-url
  9. ```
  10. ## Usage
  11. ```js
  12. const url = require('native-url');
  13. url.parse('https://example.com').host // example.com
  14. url.parse('/?a=b', true).query // { a: 'b' }
  15. ```
  16. ### Usage with Webpack
  17. When you use the `url` module, webpack bundles [`node-url`](https://github.com/defunctzombie/node-url) for the browser. You can alias webpack to use `native-url` instead, saving around 7.5kB:
  18. ```js
  19. // webpack.config.js
  20. module.exports = {
  21. // ...
  22. resolve: {
  23. alias: {
  24. url: 'native-url'
  25. }
  26. }
  27. }
  28. ```
  29. The result is **functionally equivalent** in Node 7+ and all modern browsers.
  30. ### Usage with Rollup
  31. Rollup does not bundle shims for Node.js modules like `url` by default, but we can add `url` support via `native-url` using aliases:
  32. ```js
  33. // rollup.config.js
  34. import resolve from 'rollup-plugin-node-resolve';
  35. import alias from '@rollup/plugin-alias';
  36. module.exports = {
  37. // ...
  38. plugins: [
  39. resolve(),
  40. alias({
  41. entries: {
  42. url: 'native-url'
  43. }
  44. })
  45. ]
  46. };
  47. ```
  48. With this in place, `import url from 'url'` will use `native-url` and keep your bundle small.
  49. ## API
  50. Refer Node's [legacy url documentation](https://nodejs.org/api/url.html#url_legacy_url_api) for detailed API documentation.
  51. ### `url.parse(urlStr, [parseQueryString], [slashesDenoteHost])`
  52. Parses a URL string and returns a URL object representation:
  53. ```js
  54. url.parse('https://example.com');
  55. // {
  56. // href: 'http://example.com/',
  57. // protocol: 'http:',
  58. // slashes: true,
  59. // host: 'example.com',
  60. // hostname: 'example.com',
  61. // query: {},
  62. // search: null,
  63. // pathname: '/',
  64. // path: '/'
  65. // }
  66. url.parse('/foo?a=b', true).query.a; // "b"
  67. ```
  68. ### `url.format(urlObj)`
  69. Given a parsed URL object, returns its corresponding URL string representation:
  70. ```js
  71. url.format({ protocol: 'https', host: 'example.com' });
  72. // "https://example.com"
  73. ```
  74. ### `url.resolve(from, to)`
  75. Resolves a target URL based on the provided base URL:
  76. ```js
  77. url.resolve('/a/b', 'c');
  78. // "/a/b/c"
  79. url.resolve('/a/b', '/c#d');
  80. // "/c#d"
  81. ```
  82. ## Polyfill for Older Browsers
  83. `native-url` relies on the DOM [URL API](https://developer.mozilla.org/en-US/docs/Web/API/URL) to work. For older browsers that don't support the `URL` API, a [polyfill](https://www.npmjs.com/package/url-polyfill) is available.
  84. Conveniently, a polyfill is never needed for [browsers that support ES Modules](https://caniuse.com/#feat=es6-module), so we can use `<script nomodule>` to conditionally load it for older browsers:
  85. ```html
  86. <script nomodule src="/path/to/url-polyfill.js"></script>
  87. ```