Skip to content

Commit

Permalink
docs: Textlint fixes
Browse files Browse the repository at this point in the history
  • Loading branch information
khalwat committed Aug 13, 2024
1 parent c9c3a48 commit 6acae01
Showing 1 changed file with 13 additions and 13 deletions.
26 changes: 13 additions & 13 deletions docs/docs/index.md
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ To install the plugin, follow these instructions.

3. In the Control Panel, go to Settings → Plugins and click the “Install” button for Vite.

4. Install Vite. Vite's *[Getting Started Guide](https://vitejs.dev/guide/)* provides various installation options.
4. Install Vite. Vites *[Getting Started Guide](https://vitejs.dev/guide/)* provides various installation options.

## Vite Overview

Expand Down Expand Up @@ -131,9 +131,9 @@ hosted on a CDN or such.

### Vite 5.0 or later

As of Vite 5.0 or later, there's been a [change to where the `manifest.json`](https://vitejs.dev/guide/migration#manifest-files-are-now-generated-in-vite-directory-by-default) is generated by default.
As of Vite 5.0 or later, theres been a [change to where the `manifest.json`](https://vitejs.dev/guide/migration#manifest-files-are-now-generated-in-vite-directory-by-default) is generated by default.

It is now placed inside a `.vite/` directory by default. You can accomodate this in either of the following ways:
It is now placed inside a `.vite/` directory by default. You can accommodate this in either of the following ways:

* Change the `manifest` setting in your `vite.config.js` file to `manifest.json` (it can not either be a `bool` or a file path `string`)
* Change the `manifestPath` setting in your `config/vite.php` file to `'@webroot/dist/.vite/manifest.json'`
Expand Down Expand Up @@ -232,7 +232,7 @@ the [module/nomodule](https://philipwalton.com/articles/deploying-es2015-code-in

Your entry scripts are what you list in the `build.rollupOptions.input` section of the config.

Vite is typically used with frameworks which take care of the HMR via the dev server. However, in order to get your entry scripts to HMR you need to add this snippet to each entry script:
Vite is typically used with frameworks which take care of the HMR via the dev server. However, to get your entry scripts to HMR you need to add this snippet to each entry script:

```js
// Accept HMR as per: https://vitejs.dev/guide/api-hmr.html
Expand All @@ -243,9 +243,9 @@ if (import.meta.hot) {
}
```
If you don't do the above, you'll get a full page reload whenever you modify one of your entry scripts.
If you dont do the above, youll get a full page reload whenever you modify one of your entry scripts.
Anything your scripts import will be automatically HMR'd by the dev server.
Anything your scripts import will be automatically HMRd by the dev server.
#### Live Reload of Twig Config
Expand Down Expand Up @@ -410,7 +410,7 @@ web_environment:

Then be sure to set `criticalUrl` to `http://localhost` as part of your rollup configuration.

Finally note that as of DDEV 1.19 you are able to specify Node (and Composer) versions directly via `/.ddev/config.yaml`. See more at https://ddev.readthedocs.io/en/stable/users/cli-usage/#nodejs-npm-nvm-and-yarn
Finally note that as of DDEV 1.19 you are able to specify Node.js (and Composer) versions directly via `/.ddev/config.yaml`. See more at https://ddev.readthedocs.io/en/stable/users/cli-usage/#nodejs-npm-nvm-and-yarn

### Vite-Processed Assets

Expand Down Expand Up @@ -505,7 +505,7 @@ Vite automatically supports the direct linking to TypeScript (as in the above ex
files formats via plugins. You just link directly to them, that’s it.
::: tip CSS is Asynchronous by default
By default, the Vite plugin will load your [CSS asynchronously](https://www.filamentgroup.com/lab/load-css-simpler/). If you are **not** using Critical CSS, you'll want to change that to avoid Flash Of Unstyled Content (FOUC) by setting the setting the second argument to `false`:
By default, the Vite plugin will load your [CSS asynchronously](https://www.filamentgroup.com/lab/load-css-simpler/). If you are **not** using Critical CSS, youll want to change that to avoid Flash Of Unstyled Content (FOUC) by setting the setting the second argument to `false`:
```twig
{{ craft.vite.script("src/js/app.ts", false) }}
```
Expand Down Expand Up @@ -565,7 +565,7 @@ resource must match.
**N.B.:** If you use a service such as [CloudFlare](https://www.cloudflare.com/) with **Auto Minify** enabled, this alters the payload that is being delivered dynamically, which will cause the SRI check to fail, and your files will not load.
The same is true for any modifications to the built JavaScript. External changes to the built files is exactly what SRI is designed to thwart. So you will need to either disable any options that dynamically alter your built files, or don't use SRI.
The same is true for any modifications to the built JavaScript. External changes to the built files is exactly what SRI is designed to thwart. So you will need to either disable any options that dynamically alter your built files, or dont use SRI.
##### Script `onload` events
Expand Down Expand Up @@ -726,7 +726,7 @@ export default ({command}) => ({
});
```
If you need to access assets that are in the `public/` directory from Twig, there is a second parameter you can pass to `craft.vite.asset` to inidicate that the asset is coming from the `public/` directory:
To access assets that are in the `public/` directory from Twig, there is a second parameter you can pass to `craft.vite.asset` to inidicate that the asset is coming from the `public/` directory:
```twig
{{ craft.vite.asset("src/images/quote-open.svg", true) }}
Expand Down Expand Up @@ -760,7 +760,7 @@ This assumes your `vite.config.js` looks something like this:
### The `.integrity()` function
The Vite plugin includes an `.integrity()` function that will return the `integrity` hash if you're using the [vite-plugin-manifest-sri](https://www.npmjs.com/package/vite-plugin-manifest-sri) plugin for [sub-resource integrity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity) and you need the hash to build your [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).
The Vite plugin includes an `.integrity()` function that will return the `integrity` hash if youre using the [vite-plugin-manifest-sri](https://www.npmjs.com/package/vite-plugin-manifest-sri) plugin for [sub-resource integrity](https://developer.mozilla.org/en-US/docs/Web/Security/Subresource_Integrity) and you need the hash to build your [Content Security Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP).
You pass in a relative path to the entry, just as you do for JavaScript files in Vite. For example:
Expand Down Expand Up @@ -844,13 +844,13 @@ If `null` is passed in as the first parameter, it’ll use the automatic templat
### The `.getCssInlineTags()` function
If you want to inline an existing CSS file by URL or path, you do it by path:
To inline an existing CSS file by URL or path, you do it by path:
```twig
{{ craft.vite.getCssInlineTags("@webroot/path/to/css/file.css") }}
```
or by URL (but keep in mind, this will generate an additional blocking XHR):
Or by URL (but keep in mind, this will generate an additional blocking XHR):
```twig
{{ craft.vite.getCssInlineTags("@web/path/to/css/file.css") }}
Expand Down

0 comments on commit 6acae01

Please sign in to comment.