spPeoplePicker is not a function

I have created SPfx web part and deployed it to the site.

I have included scripts in config.json:

"externals": {

"jquery": {

"globalName": "jquery"

"bootstrap": {

"globalName": "bootstrap",

"globalDependencies": ["jquery"]

"appjs": {

"path": "lib/webparts/certifikatiUnosWp/scripts/app.js",

"globalName": "appjs"

"sppeoplepicker": {

"path": "lib/webparts/mySolution/scripts/sp.peoplepicker.js",

"globalName": "sppeoplepicker",

"globalDependencies": ["jquery"]

I have included jquery and sppeoplepicker at the begining od my ts file:

import * as $ from 'jquery';

import 'bootstrap';

require('jqueryui');

require('appjs');

require('sppeoplepicker');

And, I am using spPeoplePicker in the code:

(<any>$('#ppDefault')).spPeoplePicker({

minSearchTriggerLength: 2,

maximumEntitySuggestions: 10,

principalType: 1,

principalSource: 15,

searchPrefix: '',

searchSuffix: '',

displayResultCount: 6,

maxSelectedUsers: 1

});

And everything works fine; jQuery is loaded and after that, spPeoplePicker is loaded.

99 % of the time.

But, sometimes, jQuery isn't loaded before spPeoplePicker and I get error on web part load:

"spPeoplePicker is not a function"

Then, I need to reload the page and everything works again.

How can I prevent that (occasional error) from happening?

Forum Discussion