Thursday, 19 August 2021

Gulp.ps1 cannot be loaded. The file not digitally signed. You cannot run this script on the current system.

This security error can occur when the PowerShell's execution policy is set to Allsigned or Remotesigned and the script isn't signed.

Check execution policy in Power Shell: Get-ExecutionPolicy and then Get-ExecutionPolicy – list

We can change the execution policy permanently or temporarily

Set-ExecutionPolicy unrestricted

Set-ExecutionPolicy -Scope Process -ExecutionPolicy Bypass

This command sets the execution policy to bypass for only the current PowerShell session, when you open again you may need to run again.

Monday, 16 August 2021

Build your first client-side web part using SharePoint Framework

Create a new web part project:

Create a new project directory for your project and change your current folder to that directory.

Create a new project by running the Yeoman SharePoint Generator from within the new directory you created: yo @microsoft/sharepoint

Important Note:

NPM may display warnings and error messages during the installation of dependencies while it runs the npm install command. You can safely ignore these log warnings & error messages.

NPM may display a message about running npm audit at the end of the process. Don't run this command as it will upgrade packages and nested dependencies that may not have been tested by the SharePoint Framework.

Trusting the self-signed developer certificate

The client-side toolchain uses HTTPS endpoints by default. Part of the Set up your development environment process included trusting the development SSL certificate included in the toolchain on your local environment. This is required so your browser will trust the certificate.

Note:Trusting the developer certificate is required. This is a one-time process and is only required when you run your first SharePoint Framework project on a new workstation. You don't need to do this for every SharePoint Framework project.

Run this command: gulp trust-dev-cert

You will be asked to install the certificate. Click Yes

To check the structure of the code: Code .

Update your project's hosted workbench URL

Update the initialPage in serve.json to your SharePoint site and go to Terminal from View menu(If you want to run the command from Code.)

Tip: You can also start the local web server without launching a browser by including the nobrowser argument to the gulp serve command. For example, you may not want to modify the serve.json file in all your projects and instead, use a bookmark to launch your hosted workbench.

gulp serve --nobrowser

Start the local web server & launch the hosted workbench by running this command: 

gulp serve 

Use SharePoint Workbench to preview and test your web part:

After configuring the webpart property pane changes

Saturday, 7 August 2021

How to embed an image into an email with Power Automate

There is no OOTB feature to embed an image from the flow actions In Power Automate. This will require a bit of work to get the result. Showing up the Image on email body between MS Outlook or in web browser will be different. Due to security reasons sometimes that image/logo does not display or load properly in Outlook web because Outlook blocks that image content so, we need to manually click on the show blocked content link in the email.

Here are the steps to embed an image into the email body.

I have uploaded the image into Asset library: /SiteAssets/ImageCollection/1.jpg

1. Create the Power Automate flow with "Manually Trigger a flow" action.

2. Add SharePoint action: "Get file content using path" and select your site and provide the Image location in File Path.

3. Now the file content is retrieved with the “Get file content using path” and to embed the image content into the email body, we need to convert that content into base64

base64 is an encoding algorithm that converts any characters, binary data, and even images or sound files into a readable string, which can be saved or transported over the network without data loss.

4. Here we will using the 'Compare' action to convert the content with the below expression.

    base64(outputs('Get_file_content_using_path')?['body'])


5. Now we need to create an image HTML and add base64 converted content to that variable.

    <img src="data:image/png;base64,@{outputs('Compose')}" alt = "My Quote" />

6. Add the "HTMLImage" variable as you want to display it in the "Send an email (V2)" action email body.

booom, here is the output!

Note: Some mail clients do not support base64 encoded images. For example, Gmail does not show any base64 encoded images.