Search code examples
office-jsoffice-ui-fabricscriptlab

Syntax error when using Office UI Fabric in a ScriptLab' JavaScript project


In a new ScriptLab's JavaScript project, I added the following library to get Office UI Fabric functionality:

https://static2.sharepointonline.com/files/fabric/office-ui-fabric-js/1.2.0/js/fabric.min.js

So I wrote this script (just pay attention to the fabric word):

var ChoiceFieldGroupElements = document.querySelectorAll(".ms-ChoiceFieldGroup");
        for (var i = 0; i < ChoiceFieldGroupElements.length; i++) {
        new fabric['ChoiceFieldGroup'](ChoiceFieldGroupElements[i]);
    }

I get red lines of error syntax in the fabric keywords. I know that if the project were a TypeScript instead of a JavaScript one, I could write this in the top of the script to prevent this:

declare var fabric: any

However, what should I write in the top of JavaScript sections? I should add that the project runs normally, tough.


Solution

  • Actually, you can do just that: add declare var fabric: any.

    Script Lab uses both TypeScript and JavaScript (in the sense that it actually is always TypeScript; but with TS being a superset of JS, both work).

    So just go ahead and put this somewhere within the Script section, and the red squiggly line will disappear, and the code will continue to function properly.

    By the way, this is precisely what one of the Word samples does:

    Word Fabric sample