From 99dcffbf80c0713fa235c76e988a81bbbd238333 Mon Sep 17 00:00:00 2001 From: Ritik Banger <47841501+ritikbanger@users.noreply.github.com> Date: Fri, 31 Dec 2021 17:37:45 +0530 Subject: [PATCH 1/2] Update EntryPoint Corrected Grammatical Errors. --- src/content/concepts/entry-points.mdx | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/src/content/concepts/entry-points.mdx b/src/content/concepts/entry-points.mdx index bfdae61178ed..782273076aa3 100644 --- a/src/content/concepts/entry-points.mdx +++ b/src/content/concepts/entry-points.mdx @@ -11,6 +11,7 @@ contributors: - chenxsan - adyjs - anshumanv + - ritikbanger --- As mentioned in [Getting Started](/guides/getting-started/#using-a-configuration), there are multiple ways to define the `entry` property in your webpack configuration. We will show you the ways you **can** configure the `entry` property, in addition to explaining why it may be useful to you. @@ -52,7 +53,7 @@ module.exports = { }; ``` -Single Entry Syntax is a great choice when you are looking to quickly setup a webpack configuration for an application or tool with one entry point (i.e. a library). However, there is not much flexibility in extending or scaling your configuration with this syntax. +Single Entry Syntax is a great choice when you are looking to quickly set up a webpack configuration for an application or tool with one entry point (i.e. a library). However, there is not much flexibility in extending or scaling your configuration with this syntax. ## Object Syntax @@ -77,7 +78,7 @@ T> You can pass empty object `{}` to `entry` when you have only entry points gen ### EntryDescription object -An object with entry point description. You can specify the following properties. +An object with an entry point description. You can specify the following properties. - `dependOn`: The entry points that the current entry point depends on. They must be loaded before this entry point is loaded. - `filename`: Specifies the name of each output file on disk. @@ -85,7 +86,7 @@ An object with entry point description. You can specify the following properties - `library`: Specify [library options](/configuration/output/#outputlibrary) to bundle a library from current entry. - `runtime`: The name of the runtime chunk. When set, a new runtime chunk will be created. It can be set to `false` to avoid a new runtime chunk since webpack 5.43.0. -- `publicPath`: Specify a public URL address for the output files of this entry when they are referenced in a browser. Also see [output.publicPath](/configuration/output/#outputpublicpath). +- `publicPath`: Specify a public URL address for the output files of this entry when they are referenced in a browser. Also, see [output.publicPath](/configuration/output/#outputpublicpath). **webpack.config.js** @@ -188,11 +189,11 @@ module.exports = { **What does this do?** We are telling webpack that we would like 2 separate entry points (like the above example). -**Why?** With this you can import required libraries or files that aren't modified (e.g. Bootstrap, jQuery, images, etc) inside `vendor.js` and they will be bundled together into their own chunk. Content hash remains the same, which allows the browser to cache them separately thereby reducing load time. +**Why?** With this, you can import required libraries or files that aren't modified (e.g. Bootstrap, jQuery, images, etc) inside `vendor.js` and they will be bundled together into their own chunk. Content hash remains the same, which allows the browser to cache them separately thereby reducing load time. T> In webpack version < 4 it was common to add vendors as a separate entry point to compile it as a separate file (in combination with the `CommonsChunkPlugin`).

This is discouraged in webpack 4. Instead, the [`optimization.splitChunks`](/configuration/optimization/#optimizationsplitchunks) option takes care of separating vendors and app modules and creating a separate file. **Do not** create an entry for vendors or other stuff that is not the starting point of execution. -### Multi Page Application +### Multi-Page Application **webpack.config.js** From a16d133ec1d749820b8deb464ca246bfe54da737 Mon Sep 17 00:00:00 2001 From: Ritik Banger <47841501+ritikbanger@users.noreply.github.com> Date: Wed, 5 Jan 2022 20:11:35 +0530 Subject: [PATCH 2/2] Apply suggestions from code review Co-authored-by: Sam Chen --- src/content/concepts/entry-points.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/content/concepts/entry-points.mdx b/src/content/concepts/entry-points.mdx index 782273076aa3..437c8799b12d 100644 --- a/src/content/concepts/entry-points.mdx +++ b/src/content/concepts/entry-points.mdx @@ -78,7 +78,7 @@ T> You can pass empty object `{}` to `entry` when you have only entry points gen ### EntryDescription object -An object with an entry point description. You can specify the following properties. +An object of entry point description. You can specify the following properties. - `dependOn`: The entry points that the current entry point depends on. They must be loaded before this entry point is loaded. - `filename`: Specifies the name of each output file on disk.