Skip to content

Commit 8dd2a7b

Browse files
committed
Fix typo
Webpack -> webpack
1 parent a0cb945 commit 8dd2a7b

File tree

4 files changed

+17
-17
lines changed

4 files changed

+17
-17
lines changed

docs/javascript/compile-typescript-code-npm.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,7 @@ The [TypeScript npm package](https://www.npmjs.com/package/typescript) adds Type
100100
},
101101
```
102102

103-
To build using a third-party tool like Webpack, you can add a command-line build script to your *package.json* file:
103+
To build using a third-party tool like webpack, you can add a command-line build script to your *package.json* file:
104104

105105
```json
106106
"scripts": {
@@ -109,7 +109,7 @@ The [TypeScript npm package](https://www.npmjs.com/package/typescript) adds Type
109109
```
110110

111111
::: moniker range="vs-2019"
112-
For an example of using Webpack with React and a Webpack configuration file, see [Create a web app with Node.js and React](../javascript/tutorial-nodejs-with-react-and-jsx.md).
112+
For an example of using webpack with React and a webpack configuration file, see [Create a web app with Node.js and React](../javascript/tutorial-nodejs-with-react-and-jsx.md).
113113

114114
For an example of using Vue.js with TypeScript, see [Create a Vue.js application](create-application-with-vuejs.md).
115115
::: moniker-end
@@ -139,10 +139,10 @@ Press **Ctrl+F5** (or **Debug > Start Without Debugging**) to run the applicatio
139139

140140
## Automate build tasks
141141

142-
You can use Task Runner Explorer in Visual Studio to help automate tasks for third-party tools like npm and Webpack.
142+
You can use Task Runner Explorer in Visual Studio to help automate tasks for third-party tools like npm and webpack.
143143

144144
- [NPM Task Runner](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.NPMTaskRunner) - Adds support for npm scripts defined in *package.json*. Supports yarn.
145-
- [Webpack Task Runner](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebPackTaskRunner) - Adds support for Webpack.
145+
- [Webpack Task Runner](https://marketplace.visualstudio.com/items?itemName=MadsKristensen.WebPackTaskRunner) - Adds support for webpack.
146146

147147
## Related content
148148

docs/javascript/create-application-with-vuejs.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -84,9 +84,9 @@ To install the vue-cli npm module, open a command prompt and type `npm install -
8484
1. Type `vue init webpack client-app` and follow steps when prompted to answer additional questions.
8585

8686
> [!NOTE]
87-
> For *.vue* files, you need to use Webpack or a similar framework with a loader to do the conversion. TypeScript and Visual Studio does not know how to compile *.vue* files. The same is true for bundling; TypeScript doesn't know how to convert ES2015 modules (that is, `import` and `export` statements) into a single final *.js* file to load in the browser. Again, Webpack is the best choice here. To drive this process from within Visual Studio using MSBuild, you need to do start from a Visual Studio template. At present, there is no ASP.NET template for Vue.js development in-the-box.
87+
> For *.vue* files, you need to use webpack or a similar framework with a loader to do the conversion. TypeScript and Visual Studio does not know how to compile *.vue* files. The same is true for bundling; TypeScript doesn't know how to convert ES2015 modules (that is, `import` and `export` statements) into a single final *.js* file to load in the browser. Again, webpack is the best choice here. To drive this process from within Visual Studio using MSBuild, you need to do start from a Visual Studio template. At present, there is no ASP.NET template for Vue.js development in-the-box.
8888

89-
#### Modify the Webpack configuration to output the built files to wwwroot
89+
#### Modify the webpack configuration to output the built files to wwwroot
9090

9191
* Open the file *./client-app/config/index.js*, and change the `build.index` and `build.assetsRoot` to wwwroot path:
9292

@@ -104,7 +104,7 @@ To install the vue-cli npm module, open a command prompt and type `npm install -
104104

105105
1. On **Pre-build event command line**, type `npm --prefix ./client-app run build`.
106106

107-
#### Configure Webpack's output module names
107+
#### Configure webpack's output module names
108108

109109
* Open the file *./client-app/build/webpack.base.conf.js*, and add the following properties to the output property:
110110

@@ -146,7 +146,7 @@ These steps require vue-cli 3.0, which is currently in beta.
146146
};
147147
```
148148
149-
The preceding code configures Webpack and sets the wwwroot folder.
149+
The preceding code configures webpack and sets the wwwroot folder.
150150
151151
#### Build with vue-cli 3.0
152152

docs/javascript/tutorial-aspnet-with-typescript.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -114,7 +114,7 @@ Visual Studio opens your new project.
114114

115115
The *outDir* option specifies the output folder for the plain JavaScript files that the TypeScript compiler transpiles.
116116

117-
This configuration provides a basic introduction to using TypeScript. In other scenarios, such as when using [gulp or Webpack](https://www.typescriptlang.org/docs/handbook/asp-net-core.html), you might want a different intermediate location for the transpiled JavaScript files instead of *wwwroot/js*. The location depends on your tools and configuration preferences.
117+
This configuration provides a basic introduction to using TypeScript. In other scenarios, such as when using [gulp or webpack](https://www.typescriptlang.org/docs/handbook/asp-net-core.html), you might want a different intermediate location for the transpiled JavaScript files instead of *wwwroot/js*. The location depends on your tools and configuration preferences.
118118

119119
1. In Solution Explorer, right-click the project node and select **Add > New Folder**. Use the name *scripts* for the new folder.
120120

docs/javascript/tutorial-nodejs-with-react-and-jsx.md

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ Before you begin, here's a quick FAQ to introduce you to some key concepts:
4646

4747
JSX is a JavaScript syntax extension typically used with React to describe UI elements. You must transpile JSX code to plain JavaScript before it can run in a browser.
4848

49-
- **What is Webpack?**
49+
- **What is webpack?**
5050

5151
Webpack bundles JavaScript files so they can run in a browser, and can also transform or package other resources and assets. Webpack can specify a compiler, such as Babel or TypeScript, to transpile JSX or TypeScript code to plain JavaScript.
5252

@@ -255,9 +255,9 @@ For this simple app, you add the new project files in the project root. For most
255255

256256
This HTML page loads *app-bundle.js*, which contains the JSX and React code transpiled to plain JavaScript. Currently, *app-bundle.js* is an empty file. In the next section, you configure options to transpile the code.
257257

258-
## Configure Webpack and TypeScript compiler options
258+
## Configure webpack and TypeScript compiler options
259259

260-
Next, you add Webpack configuration code to *webpack-config.js*. You add a simple Webpack configuration that specifies an input file, *app.tsx*, and an output file, *app-bundle.js*, for bundling and transpiling JSX to plain JavaScript. For transpiling, you also configure some TypeScript compiler options. This basic configuration code is an introduction to Webpack and the TypeScript compiler.
260+
Next, you add webpack configuration code to *webpack-config.js*. You add a simple webpack configuration that specifies an input file, *app.tsx*, and an output file, *app-bundle.js*, for bundling and transpiling JSX to plain JavaScript. For transpiling, you also configure some TypeScript compiler options. This basic configuration code is an introduction to webpack and the TypeScript compiler.
261261

262262
1. In **Solution Explorer**, open **webpack-config.js** and add the following code.
263263

@@ -286,7 +286,7 @@ Next, you add Webpack configuration code to *webpack-config.js*. You add a simpl
286286
}
287287
```
288288

289-
The Webpack configuration code instructs Webpack to use the TypeScript loader to transpile the JSX.
289+
The webpack configuration code instructs webpack to use the TypeScript loader to transpile the JSX.
290290

291291
1. Open **tsconfig.json** and replace the contents with the following code, which specifies the TypeScript compiler options:
292292

@@ -318,13 +318,13 @@ Next, you add Webpack configuration code to *webpack-config.js*. You add a simpl
318318

319319
1. In **Solution Explorer**, right-click the project name and select **Open Command Prompt Here**.
320320

321-
1. In the command prompt, enter the following Webpack command:
321+
1. In the command prompt, enter the following webpack command:
322322

323323
`node_modules\.bin\webpack --config webpack-config.js`
324324

325325
The command prompt window shows the result.
326326

327-
![Screenshot that shows results of running the Webpack command.](media/tutorial-nodejs-react-run-webpack-cmd.png)
327+
![Screenshot that shows results of running the webpack command.](media/tutorial-nodejs-react-run-webpack-cmd.png)
328328

329329
If you see any errors instead of the preceding output, you must resolve them before your app will work. If your npm package versions are different than the versions this tutorial specifies, that can cause errors. To fix the errors, try the following:
330330

@@ -348,7 +348,7 @@ Next, you add Webpack configuration code to *webpack-config.js*. You add a simpl
348348

349349
![Screenshot showing a prompt whether to load modified files.](media/tutorial-nodejs-react-reload-files.png)
350350

351-
Anytime you make changes to *app.tsx*, you must rerun the Webpack command. To automate this step, you can add a build script to transpile the JSX.
351+
Anytime you make changes to *app.tsx*, you must rerun the webpack command. To automate this step, you can add a build script to transpile the JSX.
352352

353353
### Add a build script to transpile the JSX
354354

@@ -465,7 +465,7 @@ The browser starts with debugging enabled. The app isn't running yet, so the bro
465465
},
466466
```
467467

468-
This development-only setting enables debugging in Visual Studio. By default, Webpack references in the source map file include the *webpack:///* prefix, which prevents Visual Studio from finding the source file *app.tsx*. This setting overrides the generated references in the source map file, *app-bundle.js.map*, when building the app. Specifically, this setting changes the reference to the source file from *webpack:///./app.tsx* to *./app.tsx*, which enables debugging.
468+
This development-only setting enables debugging in Visual Studio. By default, webpack references in the source map file include the *webpack:///* prefix, which prevents Visual Studio from finding the source file *app.tsx*. This setting overrides the generated references in the source map file, *app-bundle.js.map*, when building the app. Specifically, this setting changes the reference to the source file from *webpack:///./app.tsx* to *./app.tsx*, which enables debugging.
469469

470470
1. Select your target browser as the debug target in Visual Studio, and then press **Ctrl**+**F5**, or select **Debug** > **Start Without Debugging**, to run the app in the browser.
471471

0 commit comments

Comments
 (0)