Skip to content

Commit

Permalink
Merge pull request #738 from OfficeDev/yefu/fix-addin-readme
Browse files Browse the repository at this point in the history 
chore: update README.md to include Preview Remote for add-in
  • Loading branch information
@1yefuwang1
1yefuwang1 authored Mar 15, 2023
2 parents f73af0f + 08c08d0 commit 6b4f8c0
Show file tree
Hide file tree
Showing 3 changed files with 20 additions and 11 deletions.
11 changes: 10 additions & 1 deletion hello-world-teams-tab-and-outlook-add-in/README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@ Deploy your project to Azure by following these steps:
## Preview Teams Tab

Once the provisioning and deployment steps are finished, you can preview your app:
Once the provisioning and deployment steps are finished, you can preview your Teams app:

- From Visual Studio Code

Expand All @@ -55,6 +55,15 @@ Once the provisioning and deployment steps are finished, you can preview your ap

- From TeamsFx CLI: execute `teamsfx preview --env dev` in your project directory to launch your application.

## Preview Outlook add-in

Once the provisioning and deployment steps are finished, you can preview your Outlook add-in from Visual Studio Code:
1. Copy the production URL from the `TAB_ENDPOINT` in env/.env.dev file.
2. Edit webpack.config.js file and change urlProd to the value you just copied. Please note to add a '/' at the end of the URL.
3. Run `npm run build:add-in`.
4. Copy `add-in\dist\manifest.dev.json` to `appPackage` folder using `npx ncp .\add-in\dist\manifest.dev.json .\appPackage\manifest.addinPreview.json`
5. Run `npx office-addin-dev-settings sideload .\appPackage\manifest.addinPreview.json`

## Validate manifest file

To check that your manifest file is valid:
Expand Down
2 changes: 1 addition & 1 deletion hello-world-teams-tab-and-outlook-add-in/add-in/webpack.config.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ const devCerts = require("office-addin-dev-certs");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");

const urlDev = "https://localhost:3000/";
const urlDev = "https://localhost:53000/";
const urlProd = "https://www.contoso.com/"; // CHANGE THIS TO YOUR PRODUCTION DEPLOYMENT LOCATION

async function getHttpsOptions() {
Expand Down
18 changes: 9 additions & 9 deletions hello-world-teams-tab-and-outlook-add-in/appPackage/manifest.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -134,15 +134,15 @@
"icons": [
{
"size": 16,
"file": "https://localhost:53000/assets/icon-16.png"
"url": "https://localhost:53000/assets/icon-16.png"
},
{
"size": 32,
"file": "https://localhost:53000/assets/icon-32.png"
"url": "https://localhost:53000/assets/icon-32.png"
},
{
"size": 80,
"file": "https://localhost:53000/assets/icon-80.png"
"url": "https://localhost:53000/assets/icon-80.png"
}
],
"controls": [
Expand All @@ -153,15 +153,15 @@
"icons": [
{
"size": 16,
"file": "https://localhost:53000/assets/icon-16.png"
"url": "https://localhost:53000/assets/icon-16.png"
},
{
"size": 32,
"file": "https://localhost:53000/assets/icon-32.png"
"url": "https://localhost:53000/assets/icon-32.png"
},
{
"size": 80,
"file": "https://localhost:53000/assets/icon-80.png"
"url": "https://localhost:53000/assets/icon-80.png"
}
],
"supertip": {
Expand All @@ -177,15 +177,15 @@
"icons": [
{
"size": 16,
"file": "https://localhost:53000/assets/icon-16.png"
"url": "https://localhost:53000/assets/icon-16.png"
},
{
"size": 32,
"file": "https://localhost:53000/assets/icon-32.png"
"url": "https://localhost:53000/assets/icon-32.png"
},
{
"size": 80,
"file": "https://localhost:53000/assets/icon-80.png"
"url": "https://localhost:53000/assets/icon-80.png"
}
],
"supertip": {
Expand Down

0 comments on commit 6b4f8c0

Please sign in to comment.