Skip to content

Commit c60a036

Browse files
committed
docs: Merging in changes from #1615
1 parent 872367f commit c60a036

File tree

1 file changed

+34
-46
lines changed

1 file changed

+34
-46
lines changed

README.md

Lines changed: 34 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,6 @@
1313
- [preact watch](#preact-watch)
1414
- [preact list](#preact-list)
1515
- [preact info](#preact-info)
16-
- [Deploying](#deploying)
1716
- [Pre-rendering](#pre-rendering)
1817
- [Custom Configuration](#custom-configuration)
1918
- [Plugins](#plugins)
@@ -25,6 +24,8 @@
2524
- [Using CSS preprocessors](#using-css-preprocessors)
2625
- [SASS](#sass)
2726
- [LESS](#less)
27+
- [Using Environment Variables](#using-environment-variables)
28+
- [Route-Based Code Splitting](#route-based-code-splitting)
2829

2930
### Features
3031

@@ -148,7 +149,7 @@ $ preact watch
148149
--prerender Pre-render static content on first run
149150
--prerenderUrls Path to pre-rendered routes config (default prerender-urls.json)
150151
--template Path to custom HTML template
151-
--refresh Will use [`Preact-refresh`](https://github.com/JoviDeCroock/preact-refresh) to do hot-reloading
152+
--refresh Enables experimental preact-refresh functionality
152153
-c, --config Path to custom CLI config (default preact.config.js)
153154
-H, --host Set server hostname (default 0.0.0.0)
154155
-p, --port Set server port (default 8080)
@@ -172,18 +173,6 @@ $ preact list
172173

173174
Prints debugging information concerning the local environment.
174175

175-
### Deploying
176-
177-
```sh
178-
# create a production build:
179-
npm run build
180-
181-
# generate configuration in Firebase Hosting format:
182-
npm run serve -- --server config
183-
184-
# Copy your static files to a server!
185-
```
186-
187176
### Pre-rendering
188177

189178
Preact CLI in order to follow [PRPL] pattern renders initial route (`/`) into generated static `index.html` - this ensures that users get to see your page before any JavaScript is run, and thus providing users with slow devices or poor connection your website's content much faster.
@@ -308,7 +297,7 @@ module.exports = [
308297

309298
#### Template
310299

311-
A template is used to render your page by [EJS](https://ejs.co/).
300+
A template is used to render your page by [EJS](https://ejs.co/).
312301
You can uses the data of `prerenderUrls` which does not have `title`, using `htmlWebpackPlugin.options.CLI_DATA.preRenderData` in EJS.
313302

314303
The default one is visible [here](packages/cli/lib/resources/template.html) and it's going to be enough for the majority of cases.
@@ -352,36 +341,6 @@ export default {
352341

353342
If you'd like to use these variables in your application, you can use the [DefinePlugin] config from our recipes wiki.
354343

355-
[promise]: https://npm.im/promise-polyfill
356-
[fetch]: https://github.com/developit/unfetch
357-
[preact]: https://github.com/preactjs/preact
358-
[webpackconfighelpers]: docs/webpack-helpers.md
359-
[`.babelrc`]: https://babeljs.io/docs/usage/babelrc
360-
[simple]: https://github.com/preactjs-templates/simple
361-
[`"browserslist"`]: https://github.com/ai/browserslist
362-
[```.babelrc```]: https://babeljs.io/docs/usage/babelrc
363-
[default]: https://github.com/preactjs-templates/default
364-
[workbox]: https://developers.google.com/web/tools/workbox
365-
[preact-router]: https://github.com/preactjs/preact-router
366-
[material]: https://github.com/preactjs-templates/material
367-
[netlify]: https://github.com/preactjs-templates/netlify
368-
[typescript]: https://github.com/preactjs-templates/typescript
369-
[widget]: https://github.com/preactjs-templates/widget
370-
[plugins wiki]: https://github.com/preactjs/preact-cli/wiki/Plugins
371-
[preactjs-templates organization]: https://github.com/preactjs-templates
372-
[preactjs-templates/default]: https://github.com/preactjs-templates/default
373-
[recipes wiki]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes
374-
[prpl]: https://developers.google.com/web/fundamentals/performance/prpl-pattern
375-
[`babel-preset-env`]: https://github.com/babel/babel-preset-env#targetsbrowsers
376-
[proof]: https://googlechrome.github.io/lighthouse/viewer/?gist=142af6838482417af741d966e7804346
377-
[preact cli preset]: https://github.com/preactjs/preact-cli/blob/master/packages/cli/lib/lib/babel-config.js
378-
[service workers]: https://developers.google.com/web/fundamentals/getting-started/primers/service-workers
379-
[customize babel]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes#customising-babel-options-using-loader-helpers
380-
[`async!`]: https://github.com/preactjs/preact-cli/blob/1.4.1/examples/full/src/components/app.js#L7
381-
[sass]: https://sass-lang.com
382-
[less]: http://lesscss.org
383-
[defineplugin]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes#use-environment-variables-in-your-application
384-
385344
### Route-Based Code Splitting
386345

387346
"Route" components are automatically code-splitted at build time to create smaller bundles and avoid loading more code than is needed by each page. This works by intercepting imports for route components with an [async loader](https://github.com/preactjs/preact-cli/tree/master/packages/async-loader), which returns a lightweight wrapper component that handles code splitting seamlessly.
@@ -411,7 +370,7 @@ Automatic code splitting is applied to all JavaScript and TypeScript files in th
411370
</td></tr>
412371
</tbody></table>
413372

414-
> **Note**:
373+
> **Note**:
415374
> Automatic code splitting **only** supports default exports, not named exports:
416375
>
417376
> ```diff
@@ -420,3 +379,32 @@ Automatic code splitting is applied to all JavaScript and TypeScript files in th
420379
> ```
421380
>
422381
> This is an intentional limitation that ensures effective code splitting. For components that need named exports, place them in a directory that doesn't trigger automatic code splitting. You can then manually code-split the default export by re-exporting it from `routes/` or importing it with the `"async!"` prefix.
382+
383+
[promise]: https://npm.im/promise-polyfill
384+
[fetch]: https://github.com/developit/unfetch
385+
[preact]: https://github.com/preactjs/preact
386+
[webpackconfighelpers]: docs/webpack-helpers.md
387+
[`.babelrc`]: https://babeljs.io/docs/usage/babelrc
388+
[simple]: https://github.com/preactjs-templates/simple
389+
[`"browserslist"`]: https://github.com/ai/browserslist
390+
[```.babelrc```]: https://babeljs.io/docs/usage/babelrc
391+
[default]: https://github.com/preactjs-templates/default
392+
[workbox]: https://developers.google.com/web/tools/workbox
393+
[preact-router]: https://github.com/preactjs/preact-router
394+
[netlify]: https://github.com/preactjs-templates/netlify
395+
[typescript]: https://github.com/preactjs-templates/typescript
396+
[widget]: https://github.com/preactjs-templates/widget
397+
[plugins wiki]: https://github.com/preactjs/preact-cli/wiki/Plugins
398+
[preactjs-templates organization]: https://github.com/preactjs-templates
399+
[preactjs-templates/default]: https://github.com/preactjs-templates/default
400+
[recipes wiki]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes
401+
[prpl]: https://developers.google.com/web/fundamentals/performance/prpl-pattern
402+
[`babel-preset-env`]: https://github.com/babel/babel-preset-env#targetsbrowsers
403+
[proof]: https://googlechrome.github.io/lighthouse/viewer/?gist=142af6838482417af741d966e7804346
404+
[preact cli preset]: https://github.com/preactjs/preact-cli/blob/master/packages/cli/lib/lib/babel-config.js
405+
[service workers]: https://developers.google.com/web/fundamentals/getting-started/primers/service-workers
406+
[customize babel]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes#customising-babel-options-using-loader-helpers
407+
[`async!`]: https://github.com/preactjs/preact-cli/blob/1.4.1/examples/full/src/components/app.js#L7
408+
[sass]: https://sass-lang.com
409+
[less]: http://lesscss.org
410+
[defineplugin]: https://github.com/preactjs/preact-cli/wiki/Config-Recipes#use-environment-variables-in-your-application

0 commit comments

Comments
 (0)