Create a basic web content add-in without Visual Studio and a Windows machine

I'm trying to develop a Content Add-in following the official documentation. The implementation section states that only few changes are needed:

• For the OfficeApp element, set the xsi:type attribute to "ContentApp".
• In the DefaultSettings element, add the RequestedHeight and RequestedWidth elements.

In the same section, two getting started with content-based add-ins are listed for PowerPoint and Excel, but unfortunately they target Visual Studio and I don't own a Windows machine. There is also reference to a 9 years old example Excel-Content-Add-in-Humongous-Insurance, that its manifest looks quite outdated.

I decided to give a try using Yeoman and VScode. Since the yo office office doesn't offer a starter for Content-based Add-in, I opted for using:

? Choose a project type: Office Add-in Task Pane project using React framework
? Choose a script type: TypeScript
? What do you want to name your add-in? my-content-addin
? Which Office client application would you like to support? Powerpoint

Following the documentation listed above I changed the xsi:type of the OfficeApp element to the ContentApp, and added the RequestedHeight and RequestedWidth elements to the DefaultSettings element.

Additionally, I noticed that Excel-Content-Add-in-Humongous-Insurance manifest didn't have the following schema in the OfficeApp:

xmlns:ov="http://schemas.microsoft.com/office/taskpaneappversionoverrides"

I checked the office-addin-manifest repository and I could not find an alternative for Content add-ins e.g., .../contentappversionoverrides. I only found an additional .../mailappversionoverrides.

I also noticed that Excel-Content-Add-in-Humongous-Insurance manifest didn't have that a VersionOverrides element so I removed from my generated manifest.xml. So, I ended with:

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<OfficeApp 
  xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" 
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
  xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0" 
  xsi:type="ContentApp">
  <Id>9e2e38ec-67af-43e6-8aeb-c8c3e22b86bd</Id>
  <Version>1.0.0.0</Version>
  <ProviderName>Contoso</ProviderName>
  <DefaultLocale>en-US</DefaultLocale>
  <DisplayName DefaultValue="my-content-addin"/>
  <Description DefaultValue="A template to get started."/>
  <IconUrl DefaultValue="https://localhost:3000/assets/icon-32.png"/>
  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/icon-64.png"/>
  <SupportUrl DefaultValue="https://www.contoso.com/help"/>
  <AppDomains>
    <AppDomain>https://www.contoso.com</AppDomain>
  </AppDomains>
  <Hosts>
    <Host Name="Presentation"/>
  </Hosts>
  <DefaultSettings>
    <SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
    <RequestedHeight>400</RequestedHeight>
    <RequestedWidth>400</RequestedWidth>
  </DefaultSettings>
  <Permissions>ReadWriteDocument</Permissions>
</OfficeApp>

After that I tried to validate the manifest and I got this errors:

Error #1: 
XML Schema Validation Error: Error found during XML Schema validation.
  - Details: The element 'DefaultSettings' in namespace 'http://schemas.microsoft.com/office/appforoffice/1.1' has invalid child element 'RequestedWidth' in namespace 'http://schemas.microsoft.com/office/appforoffice/1.1'.
  - Line: 25
  - Column: 6

Error #2: 
XML Schema Violation: Your manifest does not adhere to the current set of XML schema definitions for Office Add-in manifests.

I removed RequestedWidth although it seems to known by manifestHandlerXml.ts module from office-addin-manifest, and tried again. This time the manifest was valid. So, I ran npm start and my add-in was added to the current slide automatically.

This is my final manifest.xml

<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<OfficeApp 
  xmlns="http://schemas.microsoft.com/office/appforoffice/1.1" 
  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
  xmlns:bt="http://schemas.microsoft.com/office/officeappbasictypes/1.0" 
  xsi:type="ContentApp">
  <Id>9e2e38ec-67af-43e6-8aeb-c8c3e22b86bd</Id>
  <Version>1.0.0.0</Version>
  <ProviderName>Contoso</ProviderName>
  <DefaultLocale>en-US</DefaultLocale>
  <DisplayName DefaultValue="my-content-addin"/>
  <Description DefaultValue="A template to get started."/>
  <IconUrl DefaultValue="https://localhost:3000/assets/icon-32.png"/>
  <HighResolutionIconUrl DefaultValue="https://localhost:3000/assets/icon-64.png"/>
  <SupportUrl DefaultValue="https://www.contoso.com/help"/>
  <AppDomains>
    <AppDomain>https://www.contoso.com</AppDomain>
  </AppDomains>
  <Hosts>
    <Host Name="Presentation"/>
  </Hosts>
  <DefaultSettings>
    <SourceLocation DefaultValue="https://localhost:3000/taskpane.html"/>
    <RequestedHeight>400</RequestedHeight>
  </DefaultSettings>
  <Permissions>ReadWriteDocument</Permissions>

</OfficeApp>

How can specify a default width for my content add-in?

How can insert my add-in only when I click on a Ribbon Command like the default TaskPane demo open the taskpane?

In the Yeoman Taskpane Demo VersionOverrides requires a schema xmlns="http://schemas.microsoft.com/office/taskpaneappversionoverrides". What would be the alternative for the Control action element: <Action xsi:type="ShowTaskpane"> in a content-based add-in?

The <RequestedWidth> has to come just above the <RequestedHeight>.

There is no way to add a button to the ribbon in a Content Add-in. The content is inserted into the open Office document as soon as the add-in is installed.