Skip to content

Commit 745f1f0

Browse files
committed
Refresh of the Azure CDN web part tutorial
1 parent 2ecd7a8 commit 745f1f0

File tree

3 files changed

+15
-24
lines changed

3 files changed

+15
-24
lines changed
Loading

docs/spfx/web-parts/get-started/deploy-web-part-to-cdn.md

Lines changed: 8 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Deploy your SharePoint client-side web part to Azure CDN
33
description: Create a new sample web part and deploy its assets to an Azure CDN instead of using the default Office 365 CDN as the hosting solution.
4-
ms.date: 01/08/2018
4+
ms.date: 08/20/2018
55
ms.prod: sharepoint
66
---
77

@@ -17,6 +17,9 @@ Create a new sample web part and deploy its assets to an Azure Content Delivery
1717

1818
To configure an Azure storage account and integrate it with the CDN, follow the instructions at [Integrate an Azure storage account with Azure CDN](https://docs.microsoft.com/en-us/azure/cdn/cdn-create-a-storage-account-with-cdn), along with the detailed steps in this article.
1919

20+
> [!NOTE]
21+
> As Azure UIs are evolving fast, some of the pictures and steps might be out of date, but high level process is still valid.
22+
2023
### Storage account name
2124

2225
This is the name you used to create your storage account, as described in [Step 1: Create a storage account](https://docs.microsoft.com/en-us/azure/cdn/cdn-create-a-storage-account-with-cdn#step-1-create-a-storage-account).
@@ -105,13 +108,7 @@ Note, however, that you have not yet deployed the files.
105108

106109
At this point, Yeoman scaffolds the solution files and installs the required dependencies. This might take a few minutes. Yeoman scaffolds the project to include your custom web part as well.
107110

108-
6. After the scaffolding completes, lock down the version of the project dependencies by running the following command:
109-
110-
```sh
111-
npm shrinkwrap
112-
```
113-
114-
7. Enter the following to open the web part project in Visual Studio Code:
111+
6. Enter the following to open the web part project in Visual Studio Code:
115112

116113
```
117114
code .
@@ -123,11 +120,11 @@ Note, however, that you have not yet deployed the files.
123120

124121
This is where we control the solution packaging.
125122

126-
2. Update `includeClientSideAssets` value as **false** so that client-side assets are NOT packaged inside of the sppkg file, which is the default behavior. Because we are hosting assets from an external CDN, we do not want them to be included in the solution package. Your configuration should look somewhat like the following.
123+
2. Update `includeClientSideAssets` value as **false** so that client-side assets are NOT packaged inside of the sppkg file, which is the default behavior. As we are hosting assets from an external CDN, we do not want them to be included in the solution package. Your configuration should look somewhat like the following.
127124

128125
``` json
129126
{
130-
"$schema": "https://dev.office.com/json-schemas/spfx-build/package-solution.schema.json",
127+
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
131128
"solution": {
132129
"name": "azurehosted-webpart-client-side-solution",
133130
"id": "a4e95ed1-d096-4573-8a57-d0cc3b52da6a",
@@ -290,7 +287,7 @@ gulp bundle --ship
290287
As long as you are updating the **cdnBasePath** accordingly, your files are being properly loaded.
291288

292289
> [!NOTE]
293-
> If you find an issue in the documentation or in the SharePoint Framework, report that to SharePoint engineering by using the [issue list at the sp-dev-docs repository](https://github.com/SharePoint/sp-dev-docs/issues). Thanks for your input in advance.
290+
> If you find an issue in the documentation or in the SharePoint Framework, please report that to SharePoint engineering by using the [issue list at the sp-dev-docs repository](https://github.com/SharePoint/sp-dev-docs/issues) or by adding a comment to this article. Thanks for your input in advance.
294291
295292
## See also
296293

docs/spfx/web-parts/get-started/provision-sp-assets-from-package.md

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
---
22
title: Provision SharePoint assets from your SharePoint client-side web part
33
description: SharePoint assets can be provisioned as part of the SharePoint Framework solution, and are deployed to SharePoint sites when the solution is installed on it.
4-
ms.date: 01/08/2018
4+
ms.date: 08/20/2018
55
ms.prod: sharepoint
66
---
77

@@ -61,13 +61,7 @@ You can also follow these steps by watching this video on the SharePoint PnP You
6161

6262
At this point, Yeoman installs the required dependencies and scaffolds the solution files. This might take a few minutes. Yeoman scaffolds the project to include your **AssetDeployment** web part as well.
6363

64-
6. After the scaffolding completes, lock down the version of the project dependencies by running the following command:
65-
66-
```sh
67-
npm shrinkwrap
68-
```
69-
70-
7. Next, enter the following to open the web part project in Visual Studio Code:
64+
6. Next, enter the following to open the web part project in Visual Studio Code:
7165

7266
```
7367
code .
@@ -159,7 +153,7 @@ In the following steps, we define the needed structure to be provisioned.
159153
* Definitions use standard Feature Framework schema, which is well known to SharePoint developers.
160154
* Custom fields are being referenced in the introduced content type.
161155
* We use the **CustomSchema** attribute in the **ListInstance** element to define a provisioning time schema.xml file for the list. This way the list is still based on the out-of-the-box list template (normal custom list '100' in this case), but we can define an alternative provisioning definition during initial provisioning.
162-
* When provisioning list instances using Features you must provide the ID of the Feature associated with the particular list definition. Using the FeatureId attribute you are supposed to provide the ID of the Feature which contains the List Definition. As an example: if you’re provisioning an instance of a custom list the FeatureId attribute should be set to {00bfea71-de22-43b2-a848-c05709900100}.
156+
* When provisioning list instances using Features you must provide the ID of the Feature associated with the particular list definition. Using the FeatureId attribute you are supposed to provide the ID of the Feature which contains the List Definition. As an example: if you’re provisioning an instance of a custom list the FeatureId attribute should be set to `{00bfea71-de22-43b2-a848-c05709900100}`.
163157

164158
More details about the used schema structures can be found at [Using Features in SharePoint Foundation](https://msdn.microsoft.com/en-us/library/office/ms460318(v=office.14).aspx) on MSDN.
165159

@@ -221,7 +215,7 @@ Now we have created the needed structures for provisioning SharePoint assets aut
221215

222216
```json
223217
{
224-
"$schema": "https://dev.office.com/json-schemas/spfx-build/package-solution.schema.json",
218+
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
225219
"solution": {
226220
"name": "asset-deployment-webpart-client-side-solution",
227221
"id": "6690f11b-012f-4268-bc33-3086eb2dd287",
@@ -390,7 +384,7 @@ Next we need to update both the solution version and the feature version respons
390384

391385
```json
392386
{
393-
"$schema": "https://dev.office.com/json-schemas/spfx-build/package-solution.schema.json",
387+
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json",
394388
"solution": {
395389
"name": "asset-deployment-webpart-client-side-solution",
396390
"id": "6690f11b-012f-4268-bc33-3086eb2dd287",
@@ -476,7 +470,7 @@ Now that the package has been updated in the app catalog, we can move to the act
476470
![App status updated to updating in the site contents page](../../../images/tutorial-feature-solution-updating-app-classic.png)
477471

478472
> [!NOTE]
479-
> Because the SharePoint Framework uses the same app infrastructure as SharePoint Add-ins, the status for the upgrade indicates that the update can happen for an add-in or an app.
473+
> Because the SharePoint Framework uses the same app infrastructure as SharePoint Add-ins, the status for the upgrade indicates that the update can happen for an add-in or an app.
480474
481475
The update can take a while, but when the solution status changes to normal again, you can select **F5** to refresh the site contents page to confirm that a new list called *New List* has been successfully provisioned as part of the update process.
482476

@@ -485,7 +479,7 @@ Now that the package has been updated in the app catalog, we can move to the act
485479
Now we have successfully upgraded this instance to the latest version. This Feature Framework option for SharePoint asset provisioning is pretty much the same as it is for the SharePoint Add-in model. The key difference is that the assets are being provisioned directly to a normal SharePoint site, because there's no concept called app or add-in web with SharePoint Framework solutions.
486480

487481
> [!NOTE]
488-
> If you find an issue in the documentation or in the SharePoint Framework, report that to SharePoint engineering by using the [issue list at the sp-dev-docs repository](https://github.com/SharePoint/sp-dev-docs/issues). Thanks for your input in advance.
482+
> If you find an issue in the documentation or in the SharePoint Framework, please report that to SharePoint engineering by using the [issue list at the sp-dev-docs repository](https://github.com/SharePoint/sp-dev-docs/issues) or by adding a comment to this article. Thanks for your input in advance.
489483
490484
## See also
491485

0 commit comments

Comments
 (0)