diff --git a/articles/communication-services/quickstarts/chat/includes/chat-js.md b/articles/communication-services/quickstarts/chat/includes/chat-js.md index 386f8fee73c5a..44fb4338e8c53 100644 --- a/articles/communication-services/quickstarts/chat/includes/chat-js.md +++ b/articles/communication-services/quickstarts/chat/includes/chat-js.md @@ -2,14 +2,14 @@ title: include file description: include file services: azure-communication-services -author: probableprime +author: awang119 manager: mikben ms.service: azure-communication-services ms.subservice: azure-communication-services ms.date: 06/30/2021 ms.topic: include ms.custom: include file -ms.author: rifox +ms.author: anniewang --- ## Prerequisites @@ -60,11 +60,25 @@ The `--save` option lists the library as a dependency in your **package.json** f ### Set up the app framework -This article uses parcel to bundle the application assets. Run the following command to install it and list it as a development dependency in your **package.json**: +This article uses webpack to bundle the application assets. Run the following command to install it and list it as a development dependency in your **package.json**: ```console -npm install parcel --save-dev +npm install webpack webpack-cli webpack-dev-server --save-dev ``` + +Create a **webpack.config.js** in the root directory of your project. + +```js +module.exports = { + entry: "./client.js", + output: { + filename: "bundle.js" + }, + devtool: "inline-source-map", + mode: "development" +} +``` + Create an **index.html** file in the root directory of your project. Use this file as a template to add chat capability using the Azure Communication Chat SDK for JavaScript. ```html @@ -76,7 +90,7 @@ Create an **index.html** file in the root directory of your project. Use this fi

Azure Communication Services

Chat Quickstart

- + ``` @@ -110,12 +124,18 @@ console.log('Azure Communication Chat client created!'); ### Run the code +Update the `scripts` section in the **package.json** to include "start" +```json +"start": "webpack serve --config ./webpack.config.js" +``` + Run the following command to run your application: ```console -npx parcel index.html +npm install +npm run start ``` -Open your browser and navigate to http://localhost:1234/. In the developer tools console within your browser, you should see: +Open your browser and navigate to http://localhost:8080/. In the developer tools console within your browser, you should see: ```console Azure Communication Chat client created!