Over the past few months, we’ve done some research and talked to you about your experiences building add-ins. In response to your feedback, we are rolling out changes to the Yeoman Office Add-in generator. These changes will help you get started with add-ins faster and more easily.
Use Fabric templates
To help ensure that your add-in is successful, our design team revamped the templates in the generator to use Office UI Fabric. Fabric is the Office design language and includes styles, icons, and components that you can use to build your UI. We’ve also enhanced the generated manifests to implement add-in commands. These templates are now available by default and include the designs that show the highest add-in retention and conform to our design best practices.
Stay up-to-date on the newest technologies
Since we launched Yo Office, the top requests we’ve seen are for Browsersync and Typescript support. Today, we’re happy to announce that we’ve added support for both.
Browsersync is a test assistant that helps you tweak and test your code faster by synchronizing file changes across browsers in real time and across multiple devices. Once you edit the file, save, and Browsersync will do the rest! To find out more, visit their site.
Save time – skip the prompts and use arguments
We kept a few of the options from the old generator, but updated Yo Office to set most of the values through command-line arguments. You can use arguments to create your add-in and skip most of the prompt questions, as shown in the following example.
Install Yo Office
Yeoman is built on Node.js. If you don’t have Node.js installed on your Mac, we recommend using Node Version Manager to install it. If you are on Windows, go to nodejs.org and download the distribution for your system.
Next, open a terminal, and install the Yeoman generator and its dependencies globally by using the following command:
npm install -g yo generator-office
If you already have Yo Office installed, use the following command to update your version:
npm update -g generator-office
Now you should be ready to run the generator!
Contribute to Yo Office
The feedback we received over the past few months has helped us define the changes we’ve made to the generator. If you have more feedback to share, please log an issue on our GitHub repository. We would also like to thank the following GitHub community contributors for helping us make Yo Office what it is today!
We value your feedback and hope you continue to contribute to our generator. To make this easier, we have restructured the generator-office project files on GitHub. For example, when you include a framework folder under either js or ts, the generator will update itself to include the framework as an option for that question. To see all these changes, check out our repository. And if you haven’t already contributed to Yo Office, see our contributor’s guidelines.