diff --git a/.github/ISSUE_TEMPLATE/bug_report.md b/.github/ISSUE_TEMPLATE/bug_report.md index 7897fd6..461dc52 100644 --- a/.github/ISSUE_TEMPLATE/bug_report.md +++ b/.github/ISSUE_TEMPLATE/bug_report.md @@ -6,22 +6,19 @@ labels: bug assignees: "" --- -**Describe the bug** -A clear and concise description of what the bug is. +**Describe the bug** A clear and concise description of what the bug is. -**To Reproduce** -Steps to reproduce the behavior: +**To Reproduce** Steps to reproduce the behavior: 1. Go to '...' 2. Click on '....' 3. Scroll down to '....' 4. See error -**Expected behavior** -A clear and concise description of what you expected to happen. +**Expected behavior** A clear and concise description of what you expected to +happen. -**Screenshots** -If applicable, add screenshots to help explain your problem. +**Screenshots** If applicable, add screenshots to help explain your problem. **Desktop (please complete the following information):** @@ -29,8 +26,7 @@ If applicable, add screenshots to help explain your problem. - Deno version [e.g. v1.3.0] - denopack version [e.g. 0.10.0] -**Additional context** -Add any other context about the problem here. +**Additional context** Add any other context about the problem here. **Checklist** diff --git a/.github/ISSUE_TEMPLATE/feature_request.md b/.github/ISSUE_TEMPLATE/feature_request.md index bbcbbe7..188b54c 100644 --- a/.github/ISSUE_TEMPLATE/feature_request.md +++ b/.github/ISSUE_TEMPLATE/feature_request.md @@ -7,14 +7,14 @@ assignees: '' --- -**Is your feature request related to a problem? Please describe.** -A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] +**Is your feature request related to a problem? Please describe.** A clear and +concise description of what the problem is. Ex. I'm always frustrated when [...] -**Describe the solution you'd like** -A clear and concise description of what you want to happen. +**Describe the solution you'd like** A clear and concise description of what you +want to happen. -**Describe alternatives you've considered** -A clear and concise description of any alternative solutions or features you've considered. +**Describe alternatives you've considered** A clear and concise description of +any alternative solutions or features you've considered. -**Additional context** -Add any other context or screenshots about the feature request here. +**Additional context** Add any other context or screenshots about the feature +request here. diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 6db742a..681969b 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -17,7 +17,7 @@ jobs: - name: Setup latest deno version uses: denolib/setup-deno@v2 with: - deno-version: v1.4.4 + deno-version: v1.7.0 - name: Format run: deno fmt --check diff --git a/.vscode/settings.json b/.vscode/settings.json index f54674e..79240ea 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -4,4 +4,7 @@ "deno.lint": true, "editor.formatOnSave": true, "editor.defaultFormatter": "denoland.vscode-deno", + "editor.codeActionsOnSave": { + "source.organizeImports": true + } } diff --git a/CHANGELOG.md b/CHANGELOG.md index 474b14a..68267dc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,7 +3,8 @@ All notable changes to this project will be documented in this file. The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), -and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html). +and this project adheres to +[Semantic Versioning](https://semver.org/spec/v2.0.0.html). ## [0.10.0](https://github.com/denofn/denopack/compare/0.9.1..0.10.0) - 2020-10-05 @@ -61,7 +62,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed -- Switched out custom filter function in cssBundle for official Rollup createFilter function +- Switched out custom filter function in cssBundle for official Rollup + createFilter function ## [0.6.0](https://github.com/denofn/denopack/compare/0.5.0..0.6.0) - 2020-08-18 @@ -82,36 +84,47 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 ### Changed - Directory loading to support dynamic imports and code splitting -- BREAKING: pluginTerserTransform is now an actual transform plugin, not an output plugin -- Sourcemapping identifiers are now appended in CLI, not in pluginTerserTransform +- BREAKING: pluginTerserTransform is now an actual transform plugin, not an + output plugin +- Sourcemapping identifiers are now appended in CLI, not in + pluginTerserTransform ## [0.4.0](https://github.com/denofn/denopack/compare/0.3.2..0.4.0) - 2020-08-11 ### Added -- Handle entry file redirects (re: [denoland/deno/issues/3082](https://github.com/denoland/deno/issues/3082)) -- Rollup cache support for incremental compiles in [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) -- File watch mode (pluginTypescriptCompile is **not** supported) in [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) +- Handle entry file redirects (re: + [denoland/deno/issues/3082](https://github.com/denoland/deno/issues/3082)) +- Rollup cache support for incremental compiles in + [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) +- File watch mode (pluginTypescriptCompile is **not** supported) in + [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) ### Changed -- Default plugin hook changed from useCompile to useCache in [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) -- Extra CLI options like print, watch and cache are now verbose in [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) +- Default plugin hook changed from useCompile to useCache in + [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) +- Extra CLI options like print, watch and cache are now verbose in + [denofn/denopack/pull/5](https://github.com/denofn/denopack/pull/5) - File watch uses debounce, taking last event in series as a trigger ## [0.3.2](https://github.com/denofn/denopack/compare/0.3.0..0.3.2) - 2020-08-08 ### Fixed -- Load config from file URI relative to CWD instead of absolute path (this broke stuff on installs from registries) +- Load config from file URI relative to CWD instead of absolute path (this broke + stuff on installs from registries) ## [0.3.0](https://github.com/denofn/denopack/compare/0.2.0..0.3.0) - 2020-08-07 ### Added -- Source map support in [denofn/denopack/pull/2](https://github.com/denofn/denopack/pull/2) -- Lockfile integrity checking in [denofn/denopack/pull/4](https://github.com/denofn/denopack/pull/4) +- Source map support in + [denofn/denopack/pull/2](https://github.com/denofn/denopack/pull/2) +- Lockfile integrity checking in + [denofn/denopack/pull/4](https://github.com/denofn/denopack/pull/4) ### Changed -- Hooks now take one configuration object as parameter where needed in [denofn/denopack/pull/4](https://github.com/denofn/denopack/pull/4) +- Hooks now take one configuration object as parameter where needed in + [denofn/denopack/pull/4](https://github.com/denofn/denopack/pull/4) diff --git a/CODE_OF_CONDUCT.md b/CODE_OF_CONDUCT.md index 3a476b1..e30a0a9 100644 --- a/CODE_OF_CONDUCT.md +++ b/CODE_OF_CONDUCT.md @@ -5,31 +5,31 @@ In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body -size, disability, ethnicity, sex characteristics, gender identity and expression, -level of experience, education, socio-economic status, nationality, personal -appearance, race, religion, or sexual identity and orientation. +size, disability, ethnicity, sex characteristics, gender identity and +expression, level of experience, education, socio-economic status, nationality, +personal appearance, race, religion, or sexual identity and orientation. ## Our Standards Examples of behavior that contributes to creating a positive environment include: -* Using welcoming and inclusive language -* Being respectful of differing viewpoints and experiences -* Gracefully accepting constructive criticism -* Focusing on what is best for the community -* Showing empathy towards other community members +- Using welcoming and inclusive language +- Being respectful of differing viewpoints and experiences +- Gracefully accepting constructive criticism +- Focusing on what is best for the community +- Showing empathy towards other community members Examples of unacceptable behavior by participants include: -* The use of sexualized language or imagery and unwelcome sexual attention or - advances -* Trolling, insulting/derogatory comments, and personal or political attacks -* Public or private harassment -* Publishing others' private information, such as a physical or electronic - address, without explicit permission -* Other conduct which could reasonably be considered inappropriate in a - professional setting +- The use of sexualized language or imagery and unwelcome sexual attention or + advances +- Trolling, insulting/derogatory comments, and personal or political attacks +- Public or private harassment +- Publishing others' private information, such as a physical or electronic + address, without explicit permission +- Other conduct which could reasonably be considered inappropriate in a + professional setting ## Our Responsibilities @@ -37,11 +37,11 @@ Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior. -Project maintainers have the right and responsibility to remove, edit, or -reject comments, commits, code, wiki edits, issues, and other contributions -that are not aligned to this Code of Conduct, or to ban temporarily or -permanently any contributor for other behaviors that they deem inappropriate, -threatening, offensive, or harmful. +Project maintainers have the right and responsibility to remove, edit, or reject +comments, commits, code, wiki edits, issues, and other contributions that are +not aligned to this Code of Conduct, or to ban temporarily or permanently any +contributor for other behaviors that they deem inappropriate, threatening, +offensive, or harmful. ## Scope @@ -58,8 +58,9 @@ Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at contact@jeroenpeeters.me. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is -obligated to maintain confidentiality with regard to the reporter of an incident. -Further details of specific enforcement policies may be posted separately. +obligated to maintain confidentiality with regard to the reporter of an +incident. Further details of specific enforcement policies may be posted +separately. Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other @@ -67,8 +68,9 @@ members of the project's leadership. ## Attribution -This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, -available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html +This Code of Conduct is adapted from the [Contributor Covenant][homepage], +version 1.4, available at +https://www.contributor-covenant.org/version/1/4/code-of-conduct.html [homepage]: https://www.contributor-covenant.org diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index afe418b..858c805 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -1,13 +1,8 @@ # Contributing -- If you are using vscode, install and enable the [required extensions](./.vscode/extensions.json). - - If you are not using vscode, sort your imports and use the following prettier settings: - - semi: true - - singleQuote: false - - printWidth: 100 - - trailingComma: "es5" - - tabWidth: 2 - - useTabs: false +- If you are using vscode, install and enable the + [required extensions](./.vscode/extensions.json). + - If you are not using vscode, sort your imports and run `deno fmt`. - Functions, constants and variables are always camelCase - Classes are allowed to be PascalCase - Extract shared code to [util](./util) @@ -15,14 +10,22 @@ ## Contributing denopack plugins -Contributing a plugin to the denopack repo is not only extremely welcomed, it's even encouraged. That does mean a few conventions are in order, extending from the existing [Rollup conventions](https://rollupjs.org/guide/en/#conventions) these are: +Contributing a plugin to the denopack repo is not only extremely welcomed, it's +even encouraged. That does mean a few conventions are in order, extending from +the existing [Rollup conventions](https://rollupjs.org/guide/en/#conventions) +these are: - Plugins should have a clear plugin name with a `denopack-plugin-` prefix - Plugin functions are always camelCased and are default exported -- Plugins and their documentation should be stored in a separate folder [inside the plugin directory](./plugin) -- Optionally also indicating what the most impactful action is (resolve, load, transform, bundle ...). The [typescriptCompile](./plugin/typescriptCompile) plugin is an obvious exception, but do take a look at the naming of the [other plugins](./plugin) +- Plugins and their documentation should be stored in a separate folder + [inside the plugin directory](./plugin) +- Optionally also indicating what the most impactful action is (resolve, load, + transform, bundle ...). The [typescriptCompile](./plugin/typescriptCompile) + plugin is an obvious exception, but do take a look at the naming of the + [other plugins](./plugin) - Use async Deno APIs (readFile not readFileSync, etc.) -- Document your plugin in English and **detail what flags are required**! [Here's an example](./plugin/typescriptCompile/README.md) +- Document your plugin in English and **detail what flags are required**! + [Here's an example](./plugin/typescriptCompile/README.md) ## Contributing denopack hooks @@ -32,5 +35,7 @@ Contributing a hook follows the following conventions: - Hooks are always camelCased - Hooks are stored inside of [hooks.ts](./plugin/hooks.ts) - Hooks are always functions and always return an array of plugins -- Using plugins that accept configuration options in hooks should always be allowed to pass config down to that plugin -- Configuration options are stored in one object containing all configuration options, see [hooks.ts](./plugin/hooks.ts) for examples +- Using plugins that accept configuration options in hooks should always be + allowed to pass config down to that plugin +- Configuration options are stored in one object containing all configuration + options, see [hooks.ts](./plugin/hooks.ts) for examples diff --git a/README.md b/README.md index 1db26ea..50ad9c7 100644 --- a/README.md +++ b/README.md @@ -12,9 +12,11 @@ ## Preface -🦕📦 denopack is a CLI tool and a collection of plugins designed for bundling code to be used with Deno or in the browser. _No node_modules, no npm or yarn needed._ +🦕📦 denopack is a CLI tool and a collection of plugins designed for bundling code +to be used with Deno or in the browser. _No node_modules, no npm or yarn +needed._ -**General note: make sure you are running Deno v1.2.0 or later** +**General note: make sure you are running Deno v1.7.0 or later** ### Installation @@ -26,7 +28,8 @@ deno run --allow-run --allow-read https://deno.land/x/denopack@0.10.0/install.ts deno run --allow-run --allow-read https://x.nest.land/denopack@0.10.0/install.ts ``` -**NOTE: denopack uses unstable Deno APIs. These APIs are not final and may break, but this does mean `--unstable` is mandatory!** +**NOTE: denopack uses unstable Deno APIs. These APIs are not final and may +break, but this does mean `--unstable` is mandatory!** ## Documentation @@ -38,5 +41,8 @@ See [CONTRIBUTING.md](./CONTRIBUTING.md) ## Acknowledgements -- Reddit user [u/HarmonicAscendant](https://www.reddit.com/r/Deno/comments/hlm7dd/any_frontend_build_tools_for_deno_yet/) - unrelated to this library - who coined the name name Denopack -- The sauropod and package emoji's courtesy of [Twemoji](https://twemoji.twitter.com/) +- Reddit user + [u/HarmonicAscendant](https://www.reddit.com/r/Deno/comments/hlm7dd/any_frontend_build_tools_for_deno_yet/) - + unrelated to this library - who coined the name name Denopack +- The sauropod and package emoji's courtesy of + [Twemoji](https://twemoji.twitter.com/) diff --git a/cli/persistCache.ts b/cli/persistCache.ts index d0b898c..b803d6b 100644 --- a/cli/persistCache.ts +++ b/cli/persistCache.ts @@ -1,6 +1,6 @@ import type { RollupCache } from "../deps.ts"; -export async function persistCache( +export function persistCache( cachePath: string, cache: RollupCache, ): Promise { diff --git a/docs/customWatchScript.ts b/docs/customWatchScript.ts index fe3f8d1..89b3eae 100644 --- a/docs/customWatchScript.ts +++ b/docs/customWatchScript.ts @@ -1,7 +1,7 @@ import { debounce } from "../deps.ts"; async function watch() { - const run = debounce(async function () { + const run = debounce(() => { Deno.run({ cmd: ["vr", "start"], }); diff --git a/plugin/README.md b/plugin/README.md index 91a7116..a8e941c 100644 --- a/plugin/README.md +++ b/plugin/README.md @@ -15,10 +15,18 @@ denopack provides several built-in plugins that you can use ## Hooks -Some of these plugins are collected in strategies that are defined as hooks. These hooks will always return as an array of plugins. Your choice in strategy will probably depend on the permissions you want the bundling to happen with: +Some of these plugins are collected in strategies that are defined as hooks. +These hooks will always return as an array of plugins. Your choice in strategy +will probably depend on the permissions you want the bundling to happen with: -- `useCacheLazy` is the least invasive, always resolving to a file (thus needing `--allow-read`). The downside is that everything already needs to be pre-cached before bundling starts. It does also require access to environment variables to find DENO_DIR (`--allow-env`) -- `useCache` require an additional, potential `--allow-net` if files aren't cached yet. -- `useAlwaysFetch`, `useCompile` and `useCompileAsLoader` require `--allow-read` and `--allow-net` +- `useCacheLazy` is the least invasive, always resolving to a file (thus needing + `--allow-read`). The downside is that everything already needs to be + pre-cached before bundling starts. It does also require access to environment + variables to find DENO_DIR (`--allow-env`) +- `useCache` require an additional, potential `--allow-net` if files aren't + cached yet. +- `useAlwaysFetch`, `useCompile` and `useCompileAsLoader` require `--allow-read` + and `--allow-net` -**NOTE: aside from permission flags, all of these hooks require `--unstable` to leverage compilation/transpilation** +**NOTE: aside from permission flags, all of these hooks require `--unstable` to +leverage compilation/transpilation** diff --git a/plugin/cacheLoader/README.md b/plugin/cacheLoader/README.md index 285b656..be33aaf 100644 --- a/plugin/cacheLoader/README.md +++ b/plugin/cacheLoader/README.md @@ -6,9 +6,14 @@ ## Options -- `lazy [boolean]`: defaults to false. If active, this will skip checking whether the file actually exists locally and will lazily return the assumed path -- `cacheOnly [boolean]`: throws if an external dependency is not found inside the cache -- `lockFile [string]`: path to a lockfile (for example: `lock.json`). Throws if the integrity of the loaded cache file does not match the integrity in the lockfile +- `lazy [boolean]`: defaults to false. If active, this will skip checking + whether the file actually exists locally and will lazily return the assumed + path +- `cacheOnly [boolean]`: throws if an external dependency is not found inside + the cache +- `lockFile [string]`: path to a lockfile (for example: `lock.json`). Throws if + the integrity of the loaded cache file does not match the integrity in the + lockfile ## Required flags diff --git a/plugin/cacheLoader/mod.ts b/plugin/cacheLoader/mod.ts index 2318e9e..1e3f9d4 100644 --- a/plugin/cacheLoader/mod.ts +++ b/plugin/cacheLoader/mod.ts @@ -36,7 +36,7 @@ export function pluginCacheLoader(opts: Opts = {}): Plugin { return { name: "denopack-plugin-cacheLoader", - async load(id) { + load(id) { if (!isHttpUrl(id)) return null; return cacheLoader(id, opts, lockFile); }, diff --git a/plugin/chainResolver/README.md b/plugin/chainResolver/README.md index 146397a..497cf0e 100644 --- a/plugin/chainResolver/README.md +++ b/plugin/chainResolver/README.md @@ -1,6 +1,7 @@ # denopack/plugin/chainResolver -If files are resolved, Rollup will skip all other resolvers for that file. Sometimes you still want to do extra resolving. +If files are resolved, Rollup will skip all other resolvers for that file. +Sometimes you still want to do extra resolving. ## Usage diff --git a/plugin/cssBundle/README.md b/plugin/cssBundle/README.md index df14caa..2d67175 100644 --- a/plugin/cssBundle/README.md +++ b/plugin/cssBundle/README.md @@ -6,15 +6,18 @@ Denopack plugin that bundles imported CSS ## Options -- `output [string | false]`: default `"bundle.css"`. Filename of the css bundle. Will emit no file if output is `false` +- `output [string | false]`: default `"bundle.css"`. Filename of the css bundle. + Will emit no file if output is `false` ## Required flags -- `--allow-read` and `--allow-env` because @rollup/pluginutils uses `std/node/process.ts` +- `--allow-read` and `--allow-env` because @rollup/pluginutils uses + `std/node/process.ts` ## Attribution -This plugin is a rough rewrite of [rollup-plugin-css-only](https://github.com/thgh/rollup-plugin-css-only). +This plugin is a rough rewrite of +[rollup-plugin-css-only](https://github.com/thgh/rollup-plugin-css-only). ## Usage diff --git a/plugin/cssBundle/mod.ts b/plugin/cssBundle/mod.ts index 7fd83dd..039c6a2 100644 --- a/plugin/cssBundle/mod.ts +++ b/plugin/cssBundle/mod.ts @@ -10,10 +10,9 @@ The above copyright notice and this permission notice shall be included in all c THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. */ -import { createFilter } from "../deps.ts"; -import { fs, path } from "../../deps.ts"; - import type { OutputAsset, Plugin } from "../../deps.ts"; +import { fs, path } from "../../deps.ts"; +import { createFilter } from "../deps.ts"; type Opts = { output?: string | boolean; @@ -48,7 +47,7 @@ export function pluginCssBundle(options: Opts = {}): Plugin { return ""; }, - async generateBundle(opts) { + generateBundle(opts) { if ( (!changes && typeof changes !== "undefined") || options.output === false ) { diff --git a/plugin/cssBundle/test.ts b/plugin/cssBundle/test.ts index 8b26ded..a922272 100644 --- a/plugin/cssBundle/test.ts +++ b/plugin/cssBundle/test.ts @@ -30,11 +30,11 @@ Deno.test({ await fs.ensureDir(path.join(testPath, "dist")); await fs.ensureFile(path.join(testPath, "dist", "css/output.css")); - const css_output = await Deno.readTextFile( + const cssOutput = await Deno.readTextFile( path.join(testPath, "dist", "css/output.css"), ); asserts.assertStringContains( - css_output.replaceAll(/\s/g, ""), + cssOutput.replaceAll(/\s/g, ""), "body{background-color:black;}", ); } finally { diff --git a/plugin/fileLoader/README.md b/plugin/fileLoader/README.md index 4c5d8d4..d359268 100644 --- a/plugin/fileLoader/README.md +++ b/plugin/fileLoader/README.md @@ -6,7 +6,9 @@ ## Options -- `lockFile [string]`: path to a lockfile (for example: `lock.json`). Throws if the integrity of the loaded cache file does not match the integrity in the lockfile +- `lockFile [string]`: path to a lockfile (for example: `lock.json`). Throws if + the integrity of the loaded cache file does not match the integrity in the + lockfile ## Required flags diff --git a/plugin/htmlBundle/README.md b/plugin/htmlBundle/README.md index 9cef441..7581d4c 100644 --- a/plugin/htmlBundle/README.md +++ b/plugin/htmlBundle/README.md @@ -6,30 +6,52 @@ Creates HTML files to serve Rollup bundles. ## Options -- `attributes [Attributes]`: Specifies additional attributes for `html`, `link`, and `script` elements. For each property, provide an object with key-value pairs that represent an HTML element attribute name and value. By default, the `html` element is rendered with an attribute of `lang="en"` - - Note: If using the `es` / `esm` output format, `{ type: 'module'}` is automatically added to attributes.script - - Attributes typing can be found [here](https://github.com/denofn/denopack/util/htmlTemplate.ts) -- `fileName [string]`: default `index.html`. Specifies the name of the HTML to emit -- `meta [object[]]`: default `[{ charset: "utf-8" }]`. Specifies attributes used to create `` elements. For each array item, provide an object with key-value pairs that represent `` element attribute names and values -- `publicPath [string]`: default `""`. Specifies a path to prepend to all bundle assets (files) in the HTML output -- `template [TemplateOpts => Promise]`: default is [the built-in default template](https://github.com/denofn/denopack/util/htmlTemplate.ts). TemplateOpts typings can be found at the same link. Specifies a function that provides the rendered source for the HTML output +- `attributes [Attributes]`: Specifies additional attributes for `html`, `link`, + and `script` elements. For each property, provide an object with key-value + pairs that represent an HTML element attribute name and value. By default, the + `html` element is rendered with an attribute of `lang="en"` + - Note: If using the `es` / `esm` output format, `{ type: 'module'}` is + automatically added to attributes.script + - Attributes typing can be found + [here](https://github.com/denofn/denopack/util/htmlTemplate.ts) +- `fileName [string]`: default `index.html`. Specifies the name of the HTML to + emit +- `meta [object[]]`: default `[{ charset: "utf-8" }]`. Specifies attributes used + to create `` elements. For each array item, provide an object with + key-value pairs that represent `` element attribute names and values +- `publicPath [string]`: default `""`. Specifies a path to prepend to all bundle + assets (files) in the HTML output +- `template [TemplateOpts => Promise]`: default is + [the built-in default template](https://github.com/denofn/denopack/util/htmlTemplate.ts). + TemplateOpts typings can be found at the same link. Specifies a function that + provides the rendered source for the HTML output - `title [string]`: default `"Rollup Bundle"`. Specifies the HTML document title ## Supported Output Formats -By default, this plugin supports the `esm` (`es`), `iife`, and `umd` [output formats](https://rollupjs.org/guide/en/#outputformat), as those are most commonly used as browser bundles. Other formats can be used, but will require using the [`template`](#options) option to specify a custom template function which renders the unique requirements of other formats. +By default, this plugin supports the `esm` (`es`), `iife`, and `umd` +[output formats](https://rollupjs.org/guide/en/#outputformat), as those are most +commonly used as browser bundles. Other formats can be used, but will require +using the [`template`](#options) option to specify a custom template function +which renders the unique requirements of other formats. ### `amd` -Will likely require use of RequireJS semantics, which allows only for a single entry ``. +Would require a separate ``. ## Attribution -This plugin is a Deno rewrite of [@rollup/plugin-html](https://github.com/rollup/plugins/blob/master/packages/html). +This plugin is a Deno rewrite of +[@rollup/plugin-html](https://github.com/rollup/plugins/blob/master/packages/html). ## Usage diff --git a/plugin/importResolver/README.md b/plugin/importResolver/README.md index 206e2e4..2a88b3c 100644 --- a/plugin/importResolver/README.md +++ b/plugin/importResolver/README.md @@ -1,7 +1,7 @@ # denopack/plugin/importResolver -Resolves the root node and only the root node. -Use this plugin if you want to write your resolving logic yourself. +Resolves the root node and only the root node. Use this plugin if you want to +write your resolving logic yourself. ## Usage diff --git a/plugin/rootResolver/README.md b/plugin/rootResolver/README.md index 52404e6..032a6dc 100644 --- a/plugin/rootResolver/README.md +++ b/plugin/rootResolver/README.md @@ -1,7 +1,7 @@ # denopack/plugin/rootResolver -Resolves the root node and only the root node. -Use this plugin if you want to write your resolving logic yourself. +Resolves the root node and only the root node. Use this plugin if you want to +write your resolving logic yourself. ## Usage diff --git a/plugin/serve/README.md b/plugin/serve/README.md index 91c6287..a52d16a 100644 --- a/plugin/serve/README.md +++ b/plugin/serve/README.md @@ -7,19 +7,25 @@ ## Options -- `contentBase`: Path or paths(`array`) the server will be serving from. They have precedence, so if two matches were to be found inside the provided paths, it will be resolved to the first path provided inside the array +- `contentBase`: Path or paths(`array`) the server will be serving from. They + have precedence, so if two matches were to be found inside the provided paths, + it will be resolved to the first path provided inside the array - `headers`: Headers to be added to the file response -- `historyApiFallback`: File to be served when no path is found. Set false to fail on not found, set true to redirect to `index.html` in your project root +- `historyApiFallback`: File to be served when no path is found. Set false to + fail on not found, set true to redirect to `index.html` in your project root - `host`: Host to serve on. Default is `localhost` -- `https`: Configuration to start a secure TLS server. You must provide a certificate file path and a keys file path in the configuration, default to false +- `https`: Configuration to start a secure TLS server. You must provide a + certificate file path and a keys file path in the configuration, default to + false - `port`: Port to serve on. Default is `10001` -- `verbose`: Logs a message indicating paths and server direction to visit in browser +- `verbose`: Logs a message indicating paths and server direction to visit in + browser ## Usage diff --git a/plugin/serve/mod.ts b/plugin/serve/mod.ts index 05741a2..227a5d0 100644 --- a/plugin/serve/mod.ts +++ b/plugin/serve/mod.ts @@ -11,13 +11,13 @@ import { createRequestHandler } from "./server.ts"; export const pluginServe = ( options: UserOptions | string | string[] = "", ): Plugin => { - let parsed_options: ServeOptions; + let parsedOptions: ServeOptions; if (Array.isArray(options)) { - parsed_options = parseOptions({ + parsedOptions = parseOptions({ contentBase: options, }); } else if (typeof options === "string") { - parsed_options = parseOptions({ + parsedOptions = parseOptions({ contentBase: [options], }); } else if ( @@ -26,34 +26,34 @@ export const pluginServe = ( if (!Array.isArray(options.contentBase)) { options.contentBase = options.contentBase ? [options.contentBase] : [""]; } - parsed_options = parseOptions(options as UserOptions); + parsedOptions = parseOptions(options as UserOptions); } else { throw new Error( "Options for serve: you must provide a valid path, list of paths or options object", ); } - if (parsed_options.https) { + if (parsedOptions.https) { createHTTPSServer( { - certFile: parsed_options.https.cert, - keyFile: parsed_options.https.key, - hostname: parsed_options.host, - port: parsed_options.port, + certFile: parsedOptions.https.cert, + keyFile: parsedOptions.https.key, + hostname: parsedOptions.host, + port: parsedOptions.port, }, - createRequestHandler(parsed_options), + createRequestHandler(parsedOptions), ); } else { createHTTPServer( { - hostname: parsed_options.host, - port: parsed_options.port, + hostname: parsedOptions.host, + port: parsedOptions.port, }, - createRequestHandler(parsed_options), + createRequestHandler(parsedOptions), ); } - let running = parsed_options.verbose === false; + let running = parsedOptions.verbose === false; return { name: "denopack-plugin-serve", @@ -61,10 +61,9 @@ export const pluginServe = ( if (!running) { running = true; - const protocol = parsed_options.https ? "https" : "http"; - const url = - `${protocol}://${parsed_options.host}:${parsed_options.port}`; - parsed_options.contentBase.forEach((base) => { + const protocol = parsedOptions.https ? "https" : "http"; + const url = `${protocol}://${parsedOptions.host}:${parsedOptions.port}`; + parsedOptions.contentBase.forEach((base) => { console.log( `${url} -> ${ path.resolve(Deno.cwd(), path.normalize(base || "./")) diff --git a/plugin/serve/server.ts b/plugin/serve/server.ts index 977ff75..dbc5d9f 100644 --- a/plugin/serve/server.ts +++ b/plugin/serve/server.ts @@ -1,5 +1,5 @@ -import { getContentType, ServerRequest, ServerResponse } from "./deps.ts"; import { path } from "../../deps.ts"; +import { getContentType, ServerRequest, ServerResponse } from "./deps.ts"; import type { ServeOptions } from "./options.ts"; const DEFAULT_MIME_TYPE = "text/plain"; @@ -9,50 +9,51 @@ const DEFAULT_MIME_TYPE = "text/plain"; * This one does the heavy lifting, search for each file and serve it to user * */ export const createRequestHandler = (options: ServeOptions) => { - return async (request: ServerRequest): Promise => { - const url_path = decodeURI(request.url.split("?")[0]); + return (request: ServerRequest): void => { + const urlPath = decodeURI(request.url.split("?")[0]); - let headers = new Headers(); + const headers = new Headers(); Object.entries(options.headers).forEach(([header, value]) => { headers.append(header, value); }); - await readFileFromContentBase(options.contentBase, url_path) - .then(({ content, path: file_path }) => { - headers.set( - "Content-Type", - getContentType(path.extname(file_path)) || DEFAULT_MIME_TYPE, - ); - request.respond({ - body: content, - headers, - }); - }) - .catch(async () => { - if (options.historyApiFallback) { - await readFileFromContentBase( + try { + const { content, path: filePath } = readFileFromContentBase( + options.contentBase, + urlPath, + ); + headers.set( + "Content-Type", + getContentType(path.extname(filePath)) || DEFAULT_MIME_TYPE, + ); + request.respond({ + body: content, + headers, + }); + } catch { + if (options.historyApiFallback) { + try { + const { content, path: filePath } = readFileFromContentBase( options.contentBase, options.historyApiFallback, - ) - .then(({ content, path: file_path }) => { - headers.set( - "Content-Type", - getContentType(path.extname(file_path)) || DEFAULT_MIME_TYPE, - ); - request.respond({ - body: content, - headers, - }); - }) - .catch(() => { - request.respond( - getNotFoundResponse(url_path, options.contentBase), - ); - }); - } else { - request.respond(getNotFoundResponse(url_path, options.contentBase)); + ); + headers.set( + "Content-Type", + getContentType(path.extname(filePath)) || DEFAULT_MIME_TYPE, + ); + request.respond({ + body: content, + headers, + }); + } catch { + request.respond( + getNotFoundResponse(urlPath, options.contentBase), + ); } - }); + } else { + request.respond(getNotFoundResponse(urlPath, options.contentBase)); + } + } }; }; @@ -78,30 +79,30 @@ interface File { //TODO //Validate alternative errors beside not found -const readFileFromContentBase = async ( - content_base: string[], +const readFileFromContentBase = ( + contentBase: string[], url: string, -): Promise => { - let file: File = { +): File => { + const file: File = { content: "", path: "", }; - for (const content_path of content_base) { - let file_path: string; + for (const contentPath of contentBase) { + let filePath: string; if (url.endsWith("/")) { - file_path = path.resolve( + filePath = path.resolve( Deno.cwd(), - path.normalize(`${content_path}/index.html`), + path.normalize(`${contentPath}/index.html`), ); } else { - file_path = path.resolve(Deno.cwd(), path.normalize(content_path + url)); + filePath = path.resolve(Deno.cwd(), path.normalize(contentPath + url)); } try { - file.content = Deno.readTextFileSync(file_path); - file.path = file_path; + file.content = Deno.readTextFileSync(filePath); + file.path = filePath; } catch { continue; } diff --git a/plugin/terserTransform/README.md b/plugin/terserTransform/README.md index 0e66596..39c52f9 100644 --- a/plugin/terserTransform/README.md +++ b/plugin/terserTransform/README.md @@ -4,7 +4,8 @@ Use Terser to minify/compress/mangle/... your bundle. ## Options -- `opts [MinifyOptions]`: this plugin accepts Terser's config object for [minify options](https://terser.org/docs/api-reference#minify-options) +- `opts [MinifyOptions]`: this plugin accepts Terser's config object for + [minify options](https://terser.org/docs/api-reference#minify-options) ## Usage diff --git a/plugin/typescriptCompile/README.md b/plugin/typescriptCompile/README.md index 2e394f8..4e34b8c 100644 --- a/plugin/typescriptCompile/README.md +++ b/plugin/typescriptCompile/README.md @@ -1,19 +1,31 @@ # denopack/plugin/typescriptCompile -Uses the internal `Deno.compile` [compiler API](https://deno.land/manual/runtime/compiler_apis) to fully compile a TS source file. +Uses the internal `Deno.compile` +[compiler API](https://deno.land/manual/runtime/compiler_apis) to fully compile +a TS source file. -It stores all resolved modules in a runtime object to load the compiled code for each module in the Rollup `load` hook. +It stores all resolved modules in a runtime object to load the compiled code for +each module in the Rollup `load` hook. -This plugin runs as a **transformer** by default, not as a loader. This is done explicitly in ease of support to allow source maps resolving to Typescript code where possible. If you want to use it as a **file loader**, please set the `useAsLoader` [option](#options) to `true`. +This plugin runs as a **transformer** by default, not as a loader. This is done +explicitly in ease of support to allow source maps resolving to Typescript code +where possible. If you want to use it as a **file loader**, please set the +`useAsLoader` [option](#options) to `true`. -To see how it behaves in conjunction with a file loader, see the `useCompile` hook in [hooks.ts](../). +To see how it behaves in conjunction with a file loader, see the `useCompile` +hook in [hooks.ts](../). -If you don't care about source maps, using the Compiler API with appears to be the most performant option (since we're not providing any extra overhead and are letting the compiler to do its work), but does require network access. To see this in action, use the `useCompileAsLoader` hook. +If you don't care about source maps, using the Compiler API with appears to be +the most performant option (since we're not providing any extra overhead and are +letting the compiler to do its work), but does require network access. To see +this in action, use the `useCompileAsLoader` hook. ## Options -- `useAsLoader [boolean]`: use as a file "loader" instead of a transformation tool -- `compilerOptions [Deno.CompilerOptions]`: this plugin accepts compiler options to pass to the Deno compiler API +- `useAsLoader [boolean]`: use as a file "loader" instead of a transformation + tool +- `compilerOptions [Deno.CompilerOptions]`: this plugin accepts compiler options + to pass to the Deno compiler API ## Required flags @@ -30,7 +42,10 @@ import { pluginTypescriptCompile } from "https://deno.land/x/denopack@0.10.0/plu import { pluginFileLoader } from "https://deno.land/x/denopack@0.10.0/plugin/fileLoader/mod.ts"; export default { - plugins: [pluginTypescriptCompile({ compilerOptions: { ...myCompilerOptions } }), pluginFileLoader()], + plugins: [ + pluginTypescriptCompile({ compilerOptions: { ...myCompilerOptions } }), + pluginFileLoader(), + ], }; ``` @@ -40,6 +55,11 @@ export default { import { pluginTypescriptCompile } from "https://deno.land/x/denopack@0.10.0/plugin/typescriptCompile/mod.ts"; export default { - plugins: [pluginTypescriptCompile({ useAsLoader: true, compilerOptions: { ...myCompilerOptions } })], + plugins: [ + pluginTypescriptCompile({ + useAsLoader: true, + compilerOptions: { ...myCompilerOptions }, + }), + ], }; ``` diff --git a/plugin/typescriptCompile/mod.ts b/plugin/typescriptCompile/mod.ts index b6f5706..93e62ef 100644 --- a/plugin/typescriptCompile/mod.ts +++ b/plugin/typescriptCompile/mod.ts @@ -1,7 +1,7 @@ import { path, Plugin } from "../../deps.ts"; import { isHttpUrl } from "../../util/isHttpUrl.ts"; import { resolver } from "../../util/resolver.ts"; -import { stripFileProtocol } from "../../util/stripFileProtocol.ts"; +import { usesProtocol } from "../../util/usesProtocol.ts"; type Options = { useAsLoader?: boolean; @@ -12,11 +12,8 @@ let modules: Record; let files: string[]; function resolveFromModules(id: string) { - const resolvedFile = isHttpUrl(id) ? id : path.resolve(id); - const originalFile = path.parse(resolvedFile); - const jsFile = originalFile.ext === ".js" - ? resolvedFile - : `${originalFile.dir}/${originalFile.name}.js`; + const resolvedFile = usesProtocol(id) ? id : path.resolve(id); + const jsFile = `${resolvedFile}.js`; if (!files.includes(jsFile)) { // Allows files like React (.js) to still be bundled since they don't get re-emitted @@ -34,22 +31,21 @@ async function resolveId( ) { if (importer || modules) return resolver(_importee, importer); - let importee = _importee; + let importee = resolver(_importee); if (isHttpUrl(importee)) { const { url, redirected } = await fetch(importee); redirected && (importee = url); } - const [diagnostics, emitMap] = await Deno.compile( - importee, - undefined, - compilerOptions, - ); + const result = await Deno.emit(importee, { compilerOptions }); + const { diagnostics } = result; - if (diagnostics) throw new Error(Deno.formatDiagnostics(diagnostics)); + if (diagnostics.length) { + throw new Error(Deno.formatDiagnostics(diagnostics)); + } - modules = stripFileProtocol(emitMap); + modules = result.files; files = Object.keys(modules); return importee; @@ -60,15 +56,15 @@ export function pluginTypescriptCompile( ): Plugin { return { name: "denopack-plugin-typescriptCompile", - async resolveId(importee, importer) { + resolveId(importee, importer) { return resolveId(compilerOptions ?? {}, importee, importer); }, - async load(id) { + load(id) { return useAsLoader ? resolveFromModules(id) : null; }, - async transform(_, id) { + transform(_, id) { return useAsLoader ? null : resolveFromModules(id); }, }; diff --git a/plugin/typescriptTransform/README.md b/plugin/typescriptTransform/README.md index 5d490fe..25cd50e 100644 --- a/plugin/typescriptTransform/README.md +++ b/plugin/typescriptTransform/README.md @@ -1,10 +1,13 @@ # denopack/plugin/typescriptTransform -Uses the internal `Deno.transpileOnly` [compiler API](https://deno.land/manual/runtime/compiler_apis) to transpile TS to JS. +Uses the internal `Deno.transpileOnly` +[compiler API](https://deno.land/manual/runtime/compiler_apis) to transpile TS +to JS. ## Options -- `opts [Deno.CompilerOptions]`: this plugin accepts compiler options to pass to the Deno compiler API +- `opts [Deno.CompilerOptions]`: this plugin accepts compiler options to pass to + the Deno compiler API ## Required flags @@ -18,6 +21,10 @@ import { pluginFileLoader } from "https://deno.land/x/denopack@0.10.0/plugin/fil import { pluginTypescriptTransform } from "https://deno.land/x/denopack@0.10.0/plugin/typescriptTransform/mod.ts"; export default { - plugins: [pluginImportResolver(), pluginFileLoader(), pluginTypescriptTransform({ ...myOptions })], + plugins: [ + pluginImportResolver(), + pluginFileLoader(), + pluginTypescriptTransform({ ...myOptions }), + ], }; ``` diff --git a/plugin/typescriptTransform/mod.ts b/plugin/typescriptTransform/mod.ts index b05df4b..03e903e 100644 --- a/plugin/typescriptTransform/mod.ts +++ b/plugin/typescriptTransform/mod.ts @@ -7,14 +7,21 @@ export function pluginTypescriptTransform(opts?: Deno.CompilerOptions): Plugin { return { name: "denopack-plugin-typescriptTransform", async transform(code, id) { - const unlock = await transpilerMutex.lock(); - const result = await Deno.transpileOnly({ [id]: code }, opts).catch( - (e) => { - throw new Error(`Failed to transpile ${id}: ${e}`); - }, - ); - unlock(); - return { code: result[id].source, map: result[id].map }; + let unlock; + try { + unlock = await transpilerMutex.lock(); + const result = await Deno.emit(id, { + sources: { [id]: code }, + compilerOptions: opts, + check: false, + }); + const { [`${id}.js`]: output, [`${id}.js.map`]: map } = result.files; + return { code: output, map }; + } catch (error) { + throw new Error(`Failed to transpile ${id}: ${error}`); + } finally { + unlock?.(); + } }, }; } diff --git a/recipes/react-template/README.md b/recipes/react-template/README.md index 39ecb17..3dc6a97 100644 --- a/recipes/react-template/README.md +++ b/recipes/react-template/README.md @@ -1,9 +1,13 @@ # React Template -This is a reimplementation of the `create-react-app` base template and comes bootstrapped with a `velociraptor` script. +This is a reimplementation of the `create-react-app` base template and comes +bootstrapped with a `velociraptor` script. -If you are using `velociraptor` you can run the project simply by running `vr build`. Otherwise run it with `denopack -c denopack.config.ts && cp public/favicon.ico dist/favicon.ico`. +If you are using `velociraptor` you can run the project simply by running +`vr build`. Otherwise run it with +`denopack -c denopack.config.ts && cp public/favicon.ico dist/favicon.ico`. Run `vr start` to enable automatic serving of the bundle. -File watching and incremental building are still very beta, your mileage may vary. +File watching and incremental building are still very beta, your mileage may +vary. diff --git a/recipes/react-template/denopack.config.ts b/recipes/react-template/denopack.config.ts index d7567e2..1838a7a 100644 --- a/recipes/react-template/denopack.config.ts +++ b/recipes/react-template/denopack.config.ts @@ -1,3 +1,7 @@ +import type { + RollupOptions, + TemplateOpts, +} from "https://deno.land/x/denopack@0.10.0/mod.ts"; import { htmlTemplate, pluginCssBundle as css, @@ -6,11 +10,7 @@ import { pluginTerserTransform as terser, useCache, } from "https://deno.land/x/denopack@0.10.0/mod.ts"; - -import type { - RollupOptions, - TemplateOpts, -} from "https://deno.land/x/denopack@0.10.0/mod.ts"; +// TODO: update this version const isDev = !Deno.env.get("REACT_APP_IS_PROD"); diff --git a/util/htmlTemplate.ts b/util/htmlTemplate.ts index 0191432..99557e8 100644 --- a/util/htmlTemplate.ts +++ b/util/htmlTemplate.ts @@ -1,8 +1,7 @@ +import type { OutputBundle } from "../deps.ts"; import { path } from "../deps.ts"; import { makeHtmlAttributes } from "./makeHtmlAttributes.ts"; -import type { OutputBundle } from "../deps.ts"; - export type Attributes = { link: Record | null; html: Record | null; @@ -20,15 +19,15 @@ export type TemplateOpts = { }; const resolveRelativePath = (from: string, to: string) => { - const raw_path = path.posix.join( + const rawPath = path.posix.join( path.relative(path.dirname(from), path.dirname(to)), path.basename(to), ); - return raw_path.startsWith(".") ? raw_path : `./${raw_path}`; + return rawPath.startsWith(".") ? rawPath : `./${rawPath}`; }; -export const htmlTemplate = async ({ +export const htmlTemplate = ({ attributes, files, meta, @@ -74,7 +73,7 @@ export const htmlTemplate = async ({ `; - return ` + return Promise.resolve(` ${metas} @@ -83,5 +82,5 @@ export const htmlTemplate = async ({ ${body} -`; +`); }; diff --git a/util/mutex.ts b/util/mutex.ts index c9e3416..143f768 100644 --- a/util/mutex.ts +++ b/util/mutex.ts @@ -11,7 +11,7 @@ export default class Mutex { let unlockNext: () => void; - let willLock = new Promise((resolve) => + const willLock = new Promise((resolve) => unlockNext = () => { this.#locks -= 1; @@ -19,7 +19,7 @@ export default class Mutex { } ); - let willUnlock = this.#locking.then(() => unlockNext); + const willUnlock = this.#locking.then(() => unlockNext); this.#locking = this.#locking.then(() => willLock); diff --git a/util/resolver.ts b/util/resolver.ts index c45baf0..5a36805 100644 --- a/util/resolver.ts +++ b/util/resolver.ts @@ -1,10 +1,7 @@ import { path } from "../deps.ts"; import { usesProtocol } from "./usesProtocol.ts"; -export function resolver( - importee: string, - importer: string | undefined, -): string { +export function resolver(importee: string, importer?: string): string { if (!importer) { // If this is a raw absolute path, make it a `file://` path. if (!usesProtocol(importee)) { @@ -13,10 +10,10 @@ export function resolver( return new URL(`file:///${importee}`).toString(); // else if relative path resolve based on Deno.cwd() } else if ( - importee.startsWith("./") || importee.startsWith("../") || - (Deno.build.os === "windows" && ( - importee.startsWith(".\\") || importee.startsWith("..\\") - )) + importee.startsWith("./") || + importee.startsWith("../") || + (Deno.build.os === "windows" && + (importee.startsWith(".\\") || importee.startsWith("..\\"))) ) { return new URL(`file:///${path.join(Deno.cwd(), importee)}`).toString(); }