Questions tagged [spfx-webparts]
Technical questions about building and using web parts based on the SharePoint Framework client-side development model.
702
questions
0
votes
1answer
12 views
How to setup the environment for the sample sp-dev-fx-webparts - client-side web part samples
I have installed git and cloned the below
https://github.com/SharePoint/sp-dev-fx-webparts/tree/master/samples
Installed node and NPM for windows.Ran npm install for just one specific folder (react-...
0
votes
2answers
33 views
The Framework Tiles from SP-Starter-Kit is not working
I pulled the tiles out of the starter kit here, https://github.com/eoverfield/sp-starter-kit. I get NO errors when I do npm install and run gulp serve.
Everything works fine locally, but when I ...
0
votes
0answers
12 views
PnP SPFx generator - Angular Elements and live change
I have been doing some tests with the Angular Element SharePoint Online Web Part project template generated by the @pnp/generator-spfx Yeoman generator (see here) to evaluate its usage for a small ...
0
votes
0answers
12 views
Can I create a “repeater” field in the properties pane similar to the image gallery webpart?
I need to make a webpart very similar to the image gallery webpart but where the webpart itself has a set of properties in the property pane and then each selected image also has a set of properties - ...
2
votes
1answer
21 views
Use CKEditor in SharePoint spfx solution with React
We are trying to set up and use CKEditor5 with React in a SharePoint spfx solution (of course also React), but we are struggling with making it work as we would like.
The Classic build of CKEditor5 ...
0
votes
1answer
43 views
SPFx webpart component set default color
I have created a tiles webpart where i am changing the color on toggle between tiles but i want to set default color for one of tiles once page load and then user can toggle
...
0
votes
1answer
8 views
Enabling Multilingual/Localization in SharePoint Framework Client Side Webparts
How to do Multilingual/Localization support in SharePoint Framework Client Side Webparts?
0
votes
1answer
28 views
Accordion in SPFX using SharePoint list [closed]
How to create an accordion SPFX webpart using SharePoint list as backend?
1
vote
0answers
15 views
How do you delete tasks from Project Server via REST?
TL;DR - it appears to be impossible to delete tasks from Project Server using the REST API. Please, someone suggest something to me, because this is excruciatingly frustrating.
I'm trying to delete ...
0
votes
0answers
5 views
What is returned when deleting tasks from Project Server using REST? 'Unexpected end of JSON input' from HttpClientResponse.json()
I'm working on an SPFx webpart to do some interactions with Project Server. As part of this, I need to delete some tasks.
I have a function that deletes tasks using HttpClient.fetch() with a DELETE ...
0
votes
1answer
38 views
SPFX REACT WebPart file upload works in Workbench but not if it is deployed to SPO
I'm developed a react webpart and try uploading a file to a Libraby. While i test it in the Workbensh it works perfectly. After deploying the webpart to SPO, it fails.
the setup of sp:
sp.setup({ ...
0
votes
0answers
18 views
How to retrieve all items across all sites under a hub?
I am building a SPFX web part (React) where I need to retrieve every item in every list in every site under the Hub site/site collection.
Can anybody point me in the right direction to accomplish ...
0
votes
3answers
62 views
Add Css in spfx
I want to add below CSS in SPFx web-part using states. But unable to do it:
div[class^='pageTitle_']
{
display: none;
}
1
vote
0answers
21 views
SPFX : TypeError: external__react_.useContext is not a function
I am using office-ui-fabric card in my spfx web part. Getting the error as below.
createComponent.tsx:51 Uncaught TypeError: external__react_.useContext is not a function
at result (...
0
votes
0answers
9 views
Are there typings for the SharePoint and MS Project JSON objects you get from the REST APIs?
I'm working on an SPFx webpart that is going to interact with Project Server, and I'm finding myself setting up things like this:
export interface ISelectProjectModalProps {
allProjects: any[];
...
0
votes
1answer
164 views
SPFX webpart creation Error: ReferenceError: primordials is not defined
I am creating SPFX webpart. Without doing any code changes i am executing gulp serve. I am getting below error for this. What could be the issue?
GULP version:
CLI version: 2.2.0
Local version: 4.0....
0
votes
2answers
39 views
SharePoint framework yo not showing all the options
I am new to SharePoint framework. I am executing yo @microsoft\sharepoint. Providing all the inputs.
For the question Which type of component to be created? it is showing only Webpart. It is not ...
0
votes
1answer
36 views
Change default port for gulp serve
I am very new to spfx development. I working with two different spfx webparts and I wanted to run both of them at the same time but it run both on 4321 default port.
I try to change port in serve....
0
votes
2answers
23 views
How do you get to the inner error of a SPHttpClientResponse that's not OK/200?
I'm trying to do some error handling in an SPFx web part, and I can't seem to get to the inner error message of a response that's not what I'm expecting.
In the following code snippet, I've ...
0
votes
1answer
43 views
Adding same webpart with different configuration, multiple times on the same page [closed]
I have created a SPFX webpart, so when I add this webpart multiple time on the same page then same data appears on both webparts even if they have different property pane configuration. The property ...
0
votes
1answer
64 views
NPM packages for React webpart SharePoint Online try to access 'fs' on client side but it's not even necessary? React SPFX
While there is a correct answer already given at:
SPFx Unable to use 'fs' module
its missing the part that in webpack config it can be outflagged like this:
node: { fs: 'empty' },
Module ...
1
vote
1answer
74 views
Title Area modern ui pages does not load
I have two modern UI pages Test1 and Test2. In Test1 page, I am using SPFx webpart to hide control on particular pages. I am using CSS:
global {
div[class^='pageTitle_'] {
display:none;
...
0
votes
1answer
27 views
gulp serve error
When run gulp serve I am getting below error
I am using below packages
I found on internet that if you are using node 12 and gulp 3 then it will have above issue but I am having node 12 and gulp 4, ...
0
votes
0answers
18 views
Spfx Web Part - API call sometimes fails to execute
I have a custom web part that uses aadHttpClientFactory to authenticate with AAD and then get data from an API secured with AAD.
It works flawlessly most of the time. Periodically, though, it gets ...
1
vote
1answer
24 views
Where is HttpClient and related classes in SPFx 1.1?
I am finally able to get started using SPFx. Stuck on 2016 / SPFx 1.1.
The documentation for the HttpClient class says it's in the @microsoft/sp-http package. However, the Yeoman generator did not ...
0
votes
1answer
20 views
Custom web part broken once deployed
I have a custom web part I created that works in the local workbench and the hosted workbench both but just shows "An unexpected error occurred" after I deploy it to my site.
In the console, I get a ...
0
votes
0answers
64 views
How to jump specific page using pnp js for sharepoint pagination
I am using pnp js Get Paged Items for pagination in my SPFx webpart.
sp.web.lists.getByTitle("MyCustomList").items.top(10).getPaged();
Suppose I have 150 data in a list. I set 10 data for a page. So ...
0
votes
1answer
45 views
Get current theme colors for SharePoint Online site in SPFx webpart
I have a SharePoint Online site with green theme color currently set. In my SPFx webpart I want to be able to get the current theme color (primary, secondary and tertiary) in TypeScript code. Below ...
0
votes
1answer
20 views
Custom Web part is not displaying to add in site Contents
I created a new basic webpart, and deployed it into the SharePoint online app catalog. After that, I tried to add it to the site contents of one SharePoint site. But webpart is not visible under "From ...
0
votes
0answers
41 views
Depolying SPFX Web Part on On Prem 2019
I used the example from the Microsoft site. I used the 2019 and Online option and added nothing extra to the project. I packaged and published the web part. I was able to deploy it to our companies ...
1
vote
1answer
16 views
Unable to approve API permissions from API Management page
I created a custom web part that calls a web API I created. When I deployed the web part, I went to approve the required permissions and received the following errors:
[HTTP]:500 - [CorrelationId]:...
0
votes
2answers
20 views
Sharepoint Online - Upload Web Part Site AppCatalog - Deploy Error
I have a simple web-part Hello Word from the tutorial of "Build your first web part" from Microsoft. However, every time I upload web part, the column "Deployed" is checked to "No", but column "Tenant ...
0
votes
1answer
30 views
Properties how pass them array value
I want to ask how pass a array value to the properties.
Always at first should be 'properties name', but I have got a lot repetable names. So I want give them to the Array. How I can pass them ? If I ...
0
votes
0answers
19 views
Search two different search boxes of List columns related data show on grid view based on text enter in SPFX?
Am able to search the PR_Number column data, the same i want to search for Description as input in another search box and show the gridview in SPFx.
import * as React from 'react';
import * as ...
0
votes
0answers
24 views
SPFx Document Web Part Deprecated?
I am trying to extend the functionality of the Documents web part
I have been trying to gulp serve this: Documents Web Part.
But it is over 2 year old and localhost refuses to work (ERR_SSL_PROTOCOL)...
0
votes
1answer
46 views
Get User Photo, Name &Title of an office 365 group using SPfx
I am trying get the user details i.e. UserName, Title and Profile picture of users that belong to a office 365 distribution group.
I tried this code sample, but I get an undefined error:
...
0
votes
0answers
44 views
SPFX and react-dnd
I promised myself never to write a StackExchange post with lots of code. But here we go.
I am basically trying to get some basic drag-and-drop behavior working in an SPFX (1.9.1) web-part using ...
0
votes
0answers
13 views
SCSS in Sharepoint Framework Library Project
Looking for the proper way of constructing my projects.
I decided to use one project per web part however is have a number of classes and react components that are common to all projects. So I ...
0
votes
0answers
21 views
SharePoint App - SPFX Webpart - Access list on site to which user does not have access
I am working in SharePoint Online.
I am trying to make a SharePoint SPFX webpart that :
Will be added to a modern page in some site collection, let's call it SiteA
Will read the contents of a ...
0
votes
0answers
74 views
Getting SharePoint news using rest API in SharePoint Online
Is there any rest API available to get the recent updates or news related to a site in SharePoint Online?
How To Read The SharePoint News Using Rest API In SPFx
I have found above post but it does ...
0
votes
2answers
25 views
Variable for theme text color
I have a custom web part that I want to have styled correctly no matter what color theme is installed on the site. I have this working correctly for my button background colors like this:
.myButtons {...
0
votes
2answers
71 views
How to stop gulp serve / workbench?
I just started my first SPFx project on SharePoint 2016.
After I key in gulp serve the workbench prompt up.
My question is, how to exit the workbench?
In my DOS prompt it seems gulp is still ...
0
votes
1answer
65 views
Image Carousel Video Autoplay true or False
I want to set autoplay true if it is video and false if it is image. I tried using setState inside autoplay as given below but it is throwing an error:
autoPlay={this.setState({ autoplayvideo: true ...
0
votes
2answers
51 views
import interface in mystrings.d.ts
I want to add multiple languages to my spfx web part.
Now I want to import some interfaces to my mystrings.d.ts declaration file.
But when I do that it breaks the definition and I get a lot of errors ...
0
votes
1answer
59 views
Image Carousel SPFx webpart with video as a source
I want to bind a video in carousel with source which is a hyperlink in the carousel.
I am able to bind images but not able to bind video as a source. How do I load videos with images?
<div style={...
0
votes
0answers
3 views
Import locale key from component
i have a few components where i export a string as identifier for each component. At the root of my webpart "webpartname.tsx" i dynamicly load different components and there i reuse the exportet ...
0
votes
1answer
39 views
SPHttpClient undefined error: Using React JS to add item in SharePoint list
I'm trying to add an item in SharePoint Online list using SPFx solution where I'm using React JS to perform the action.
Below is the copied code, when debugging it says that:
"VM242:1 Uncaught ...
0
votes
1answer
37 views
Auto play false Image Carousel SPFX webpart
I have created image carousel SPFx web-part which is set as auto-play equal to true and on click of image there is modal pop up, its working fine.
But when I click on image my modal pop up open but ...
0
votes
0answers
20 views
News webpart layout breaks on resize while hidden
I have written a wrapper for native SharePoint online News web-parts which combines them into a tabbed layout. A result of this is that a number of the web-parts are hidden most of the time. If the ...
0
votes
0answers
52 views
Connect to Common Data Service API from SpFx
We are interested in connecting to the Common Data Service API from a SpFx webpart which can be done via Postman using the following application ID:
'00000007-0000-0000-c000-000000000000': 'Dynamics ...
