Merge pull request #1484 from nanddeepn/react-provision-assets
This commit is contained in:
Hugo Bernier
GitHub
commit
c201a53aec
|
|
@ -2,7 +2,6 @@
|
|||
page_type: sample
|
||||
products:
|
||||
- office-sp
|
||||
- office-visio
|
||||
languages:
|
||||
- javascript
|
||||
- typescript
|
||||
|
|
@ -61,7 +60,8 @@ Version|Date|Comments
|
|||
- Clone this repository.
|
||||
- Open the command line, navigate to the web part folder and execute:
|
||||
- `npm i`
|
||||
- `gulp serve --nobrowser`
|
||||
- `gulp build --ship`
|
||||
- `gulp prepare-solution` This custom gulp task copies the file `e89b5ad5-9ab5-4730-a66b-e1f68994598c.json` from the folder `sharepoint\temp\` to `temp\deploy` in order to prepare the package.
|
||||
- `gulp package-solution`
|
||||
- [Deploy the package](https://docs.microsoft.com/sharepoint/dev/spfx/enterprise-guidance#management-capabilities-of--sharepoint-framework-solutions) to the app catalog
|
||||
- [Add the app](https://support.office.com/en-ie/article/Add-an-app-to-a-site-ef9c0dbd-7fe1-4715-a1b0-fe3bc81317cb?ui=en-US&rs=en-IE&ad=IE) to a site
|
||||
|
|
|
|||
|
|
@ -1,13 +1,2 @@
|
|||
{
|
||||
"entries": [
|
||||
{
|
||||
"entry": "./lib/webparts/reactProvisionAssets/ReactProvisionAssetsWebPart.js",
|
||||
"manifest": "./src/webparts/reactProvisionAssets/ReactProvisionAssetsWebPart.manifest.json",
|
||||
"outputPath": "./dist/react-provision-assets.bundle.js"
|
||||
}
|
||||
],
|
||||
"externals": {},
|
||||
"localizedResources": {
|
||||
"reactProvisionAssetsStrings": "webparts/reactProvisionAssets/loc/{locale}.js"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,4 +3,15 @@
|
|||
const gulp = require('gulp');
|
||||
const build = require('@microsoft/sp-build-web');
|
||||
|
||||
build.task('prepare-solution', {
|
||||
execute: (config) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
gulp.src('sharepoint/temp/e89b5ad5-9ab5-4730-a66b-e1f68994598c.json')
|
||||
.pipe(gulp.dest('temp/deploy'));
|
||||
|
||||
resolve();
|
||||
});
|
||||
}
|
||||
});
|
||||
|
||||
build.initialize(gulp);
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
|
|
@ -3,7 +3,7 @@
|
|||
<!--[if gte mso 9]><SharePoint:CTFieldRefs runat=server Prefix="mso:" FieldList="FileLeafRef,ClientSideApplicationId,PageLayoutType,CanvasContent1,BannerImageUrl,BannerImageOffset,PromotedState,FirstPublishedDate,LayoutWebpartsContent"><xml>
|
||||
<mso:CustomDocumentProperties>
|
||||
<mso:PageLayoutType msdt:dt="string">Article</mso:PageLayoutType>
|
||||
<mso:CanvasContent1 msdt:dt="string"><div><div data-sp-canvascontrol="" data-sp-canvasdataversion="1.0" data-sp-controldata="&#123;&quot;controlType&quot;&#58;3,&quot;webPartId&quot;&#58;&quot;e89b5ad5-9ab5-4730-a66b-e1f68994598c&quot;,&quot;id&quot;&#58;&quot;8bba86eb-3174-4917-b2b8-417af1102351&quot;&#125;"><div data-sp-webpart="" data-sp-webpartdataversion="1.0" data-sp-webpartdata="&#123;&quot;id&quot;&#58;&quot;e89b5ad5-9ab5-4730-a66b-e1f68994598c&quot;,&quot;instanceId&quot;&#58;&quot;8bba86eb-3174-4917-b2b8-417af1102351&quot;,&quot;title&quot;&#58;&quot;ReactProvisionAssets&quot;,&quot;description&quot;&#58;&quot;ReactProvisionAssets description&quot;,&quot;dataVersion&quot;&#58;&quot;1.0&quot;,&quot;properties&quot;&#58;&#123;&quot;description&quot;&#58;&quot;ReactProvisionAssets&quot;&#125;&#125;"><div data-sp-componentid="">e89b5ad5-9ab5-4730-a66b-e1f68994598c</div><div data-sp-htmlproperties=""></div></div></div></div></mso:CanvasContent1>
|
||||
<mso:CanvasContent1 msdt:dt="string"><div></div></mso:CanvasContent1>
|
||||
<mso:ContentTypeId msdt:dt="string">0x0101009D1CB255DA76424F860D91F20E6C4118</mso:ContentTypeId>
|
||||
<mso:ClientSideApplicationId msdt:dt="string">b6917cb1-93a0-4b97-a84d-7cf49975d4ec</mso:ClientSideApplicationId>
|
||||
<mso:PromotedState msdt:dt="string">0</mso:PromotedState>
|
||||
|
|
|
|||
|
|
@ -1,3 +0,0 @@
|
|||
export interface IReactProvisionAssetsWebPartProps {
|
||||
description: string;
|
||||
}
|
||||
|
|
@ -1,26 +0,0 @@
|
|||
{
|
||||
"$schema": "../../../node_modules/@microsoft/sp-module-interfaces/lib/manifestSchemas/jsonSchemas/clientSideComponentManifestSchema.json",
|
||||
|
||||
"id": "e89b5ad5-9ab5-4730-a66b-e1f68994598c",
|
||||
"alias": "ReactProvisionAssetsWebPart",
|
||||
"componentType": "WebPart",
|
||||
"version": "*", // The "*" signifies that the version should be taken from the package.json
|
||||
"manifestVersion": 2,
|
||||
|
||||
/**
|
||||
* This property should only be set to true if it is certain that the webpart does not
|
||||
* allow arbitrary scripts to be called
|
||||
*/
|
||||
"safeWithCustomScriptDisabled": false,
|
||||
|
||||
"preconfiguredEntries": [{
|
||||
"groupId": "e89b5ad5-9ab5-4730-a66b-e1f68994598c",
|
||||
"group": { "default": "Under Development" },
|
||||
"title": { "default": "ReactProvisionAssets" },
|
||||
"description": { "default": "ReactProvisionAssets description" },
|
||||
"officeFabricIconFontName": "Page",
|
||||
"properties": {
|
||||
"description": "ReactProvisionAssets"
|
||||
}
|
||||
}]
|
||||
}
|
||||
|
|
@ -1,53 +0,0 @@
|
|||
import * as React from 'react';
|
||||
import * as ReactDom from 'react-dom';
|
||||
import { Version } from '@microsoft/sp-core-library';
|
||||
import {
|
||||
BaseClientSideWebPart,
|
||||
IPropertyPaneConfiguration,
|
||||
PropertyPaneTextField
|
||||
} from '@microsoft/sp-webpart-base';
|
||||
|
||||
import * as strings from 'reactProvisionAssetsStrings';
|
||||
import ReactProvisionAssets from './components/ReactProvisionAssets';
|
||||
import { IReactProvisionAssetsProps } from './components/IReactProvisionAssetsProps';
|
||||
import { IReactProvisionAssetsWebPartProps } from './IReactProvisionAssetsWebPartProps';
|
||||
|
||||
export default class ReactProvisionAssetsWebPart extends BaseClientSideWebPart<IReactProvisionAssetsWebPartProps> {
|
||||
|
||||
public render(): void {
|
||||
const element: React.ReactElement<IReactProvisionAssetsProps > = React.createElement(
|
||||
ReactProvisionAssets,
|
||||
{
|
||||
description: this.properties.description
|
||||
}
|
||||
);
|
||||
|
||||
ReactDom.render(element, this.domElement);
|
||||
}
|
||||
|
||||
protected get dataVersion(): Version {
|
||||
return Version.parse('1.0');
|
||||
}
|
||||
|
||||
protected getPropertyPaneConfiguration(): IPropertyPaneConfiguration {
|
||||
return {
|
||||
pages: [
|
||||
{
|
||||
header: {
|
||||
description: strings.PropertyPaneDescription
|
||||
},
|
||||
groups: [
|
||||
{
|
||||
groupName: strings.BasicGroupName,
|
||||
groupFields: [
|
||||
PropertyPaneTextField('description', {
|
||||
label: strings.DescriptionFieldLabel
|
||||
})
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
};
|
||||
}
|
||||
}
|
||||
|
|
@ -1,3 +0,0 @@
|
|||
export interface IReactProvisionAssetsProps {
|
||||
description: string;
|
||||
}
|
||||
|
|
@ -1,52 +0,0 @@
|
|||
.reactProvisionAssets {
|
||||
.container {
|
||||
max-width: 700px;
|
||||
margin: 0px auto;
|
||||
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.row {
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.listItem {
|
||||
max-width: 715px;
|
||||
margin: 5px auto 5px auto;
|
||||
box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2), 0 25px 50px 0 rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.button {
|
||||
// Our button
|
||||
text-decoration: none;
|
||||
height: 32px;
|
||||
|
||||
// Primary Button
|
||||
min-width: 80px;
|
||||
background-color: #0078d7;
|
||||
border-color: #0078d7;
|
||||
color: #ffffff;
|
||||
|
||||
// Basic Button
|
||||
outline: transparent;
|
||||
position: relative;
|
||||
font-family: "Segoe UI WestEuropean","Segoe UI",-apple-system,BlinkMacSystemFont,Roboto,"Helvetica Neue",sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
border-width: 0;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
padding: 0 16px;
|
||||
|
||||
.label {
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
margin: 0 4px;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,25 +0,0 @@
|
|||
import * as React from 'react';
|
||||
import styles from './ReactProvisionAssets.module.scss';
|
||||
import { IReactProvisionAssetsProps } from './IReactProvisionAssetsProps';
|
||||
import { escape } from '@microsoft/sp-lodash-subset';
|
||||
|
||||
export default class ReactProvisionAssets extends React.Component<IReactProvisionAssetsProps, void> {
|
||||
public render(): React.ReactElement<IReactProvisionAssetsProps> {
|
||||
return (
|
||||
<div className={styles.reactProvisionAssets}>
|
||||
<div className={styles.container}>
|
||||
<div className={`ms-Grid-row ms-bgColor-themeDark ms-fontColor-white ${styles.row}`}>
|
||||
<div className="ms-Grid-col ms-u-lg10 ms-u-xl8 ms-u-xlPush2 ms-u-lgPush1">
|
||||
<span className="ms-font-xl ms-fontColor-white">Welcome to SharePoint!</span>
|
||||
<p className="ms-font-l ms-fontColor-white">Customize SharePoint experiences using Web Parts.</p>
|
||||
<p className="ms-font-l ms-fontColor-white">{escape(this.props.description)}</p>
|
||||
<a href="https://aka.ms/spfx" className={styles.button}>
|
||||
<span className={styles.label}>Learn more</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
define([], function() {
|
||||
return {
|
||||
"PropertyPaneDescription": "Description",
|
||||
"BasicGroupName": "Group Name",
|
||||
"DescriptionFieldLabel": "Description Field"
|
||||
}
|
||||
});
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
declare interface IReactProvisionAssetsStrings {
|
||||
PropertyPaneDescription: string;
|
||||
BasicGroupName: string;
|
||||
DescriptionFieldLabel: string;
|
||||
}
|
||||
|
||||
declare module 'reactProvisionAssetsStrings' {
|
||||
const strings: IReactProvisionAssetsStrings;
|
||||
export = strings;
|
||||
}
|
||||
|
|
@ -1,9 +0,0 @@
|
|||
/// <reference types="mocha" />
|
||||
|
||||
import { assert } from 'chai';
|
||||
|
||||
describe('ReactProvisionAssetsWebPart', () => {
|
||||
it('should do something', () => {
|
||||
assert.ok(true);
|
||||
});
|
||||
});
|
||||
Loading…
Reference in New Issue