Configurar el entorno de desarrollo

  • Artículo

Esta guía le ayuda a configurar herramientas para que pueda crear complementos de Office siguiendo nuestros inicios rápidos o tutoriales. Si ya los tiene instalados, está listo para comenzar un inicio rápido, como este React inicio rápido de Excel.

Obtener Microsoft 365

Necesita una cuenta de Microsoft 365. Puede calificar para una suscripción de desarrollador Microsoft 365 E5, que incluye todas las aplicaciones de Office, a través del Programa para desarrolladores de Microsoft 365; para obtener más información, consulte las preguntas más frecuentes. Como alternativa, puede registrarse para obtener una evaluación gratuita de 1 mes o comprar un plan de Microsoft 365.

Instalación del entorno

Hay tres tipos de entornos de desarrollo entre los que elegir. El scaffolding de los proyectos de complementos de Office que se crean en los tres entornos es diferente, por lo que si varias personas trabajarán en un proyecto de complemento, todos deben usar el mismo entorno.

  • entornoNode.js: recomendado. En este entorno, las herramientas se instalan y se ejecutan en una línea de comandos. El lado servidor de la parte de la aplicación web del complemento se escribe en JavaScript o TypeScript y se hospeda en un entorno de ejecución de Node.js. Hay muchas herramientas de desarrollo de complementos útiles en este entorno, como un linter de Office y un bundler/task-runner denominado webpack. La herramienta de creación de proyectos y scaffolding es una herramienta de línea de comandos denominada Generador de Office Yeoman (también denominada "Yo Office"), aunque todavía puede usar las extensiones de Visual Studio Code mencionadas en la siguiente opción.
  • Visual Studio Code: elija este entorno si usa Visual Studio Code y prefiere crear proyectos a partir de extensiones en lugar de herramientas de línea de comandos. Las herramientas de creación de proyectos y scaffolding son el kit de herramientas de Teams o las extensiones del Kit de desarrollo de complementos de Office.
  • Entorno de Visual Studio: elija este entorno solo si el equipo de desarrollo es Windows y quiere desarrollar el lado servidor del complemento con un lenguaje y un marco basados en .NET, como ASP.NET. Las plantillas de proyecto de complemento de Visual Studio no se actualizan con tanta frecuencia como las del entorno de Node.js. Más adelante, en la pestaña Entorno de Visual Studio , encontrará más información.

Nota:

Visual Studio para Mac no incluye las plantillas de scaffolding del proyecto para complementos de Office, por lo que si el equipo de desarrollo es un Equipo Mac, debe trabajar con el entorno de Node.js.

Seleccione la pestaña del entorno que elija.

Las herramientas principales que se instalarán son:

  • Node.js
  • npm
  • Editor de código de su elección
  • Generador de Office Yeoman (Yo Office)
  • Linter de JavaScript de Office

En esta guía se supone que sabe cómo usar una herramienta de línea de comandos.

Instalar Node.js y npm

Node.js es un entorno de ejecución de JavaScript que se usa para desarrollar complementos de Office modernos.

Instale Node.js descargando la versión recomendada más reciente de su sitio web. Siga las instrucciones de instalación del sistema operativo.

npm es un registro de software código abierto desde el que descargar los paquetes utilizados en el desarrollo de complementos de Office. Normalmente se instala automáticamente al instalar Node.js. Para comprobar si ya tiene npm instalado y ver la versión instalada, ejecute lo siguiente en la línea de comandos.

npm -v

Si, por algún motivo, quiere instalarlo manualmente, ejecute lo siguiente en la línea de comandos.

npm install npm -g

Sugerencia

Es posible que desee usar un administrador de versiones de Node para permitirle cambiar entre varias versiones de Node.js y npm, pero esto no es estrictamente necesario. Para obtener más información sobre cómo hacerlo, consulte las instrucciones de npm.

Instalar un editor de código

Puede usar cualquier editor de código o IDE que admita el desarrollo del lado cliente para compilar el elemento web, como:

Instalación del generador de Yeoman: Yo Office

La herramienta de creación de proyectos y scaffolding es generador de Yeoman para complementos de Office, conocido afectuosamente como Yo Office. Debe instalar la versión más reciente de Yeoman y Yo Office. Para instalar estas herramientas globalmente, ejecute el siguiente comando en el símbolo del sistema:

npm install -g yo generator-office

Instalación y uso del linter de JavaScript de Office

Microsoft proporciona un linter de JavaScript para ayudarle a detectar errores comunes al usar la biblioteca de JavaScript de Office. Si crea un proyecto de complemento con el generador de Yeoman para complementos de Office o el kit de herramientas de Teams, el linter se instala y configura automáticamente. Vaya a Ejecutar el linter.

Si ha creado el proyecto manualmente, instale y configure linter con los pasos siguientes.

  1. En la raíz del proyecto, ejecute los dos comandos siguientes (después de instalar Node.js y npm).

    npm install office-addin-lint --save-dev
npm install eslint-plugin-office-addins --save-dev

  2. En la raíz del proyecto, cree un archivo de texto denominado .eslintrc.json, si aún no hay uno. Asegúrese de que tiene propiedades denominadas plugins y extends, ambas de la matriz de tipos. La plugins matriz debe incluir "office-addins" y la extends matriz debe incluir "plugin:office-addins/recommended". A continuación puede ver un ejemplo simple. El archivo .eslintrc.json puede tener propiedades adicionales y miembros adicionales de las dos matrices.

    {
  "plugins": [
    "office-addins"
  ],
  "extends": [
    "plugin:office-addins/recommended"
  ]
}

  3. En la raíz del proyecto, abra el archivo package.json y asegúrese de que la scripts matriz tiene el siguiente miembro.

    "lint": "office-addin-lint check",

Ejecución del linter

Ejecute linter con el siguiente comando en el terminal de un editor, como Visual Studio Code, o en un símbolo del sistema. Los problemas detectados por linter aparecen en el terminal o en el símbolo del sistema, y también aparecen directamente en el código cuando se usa un editor que admite mensajes linter, como Visual Studio Code.

npm run lint

Instalar Script Lab

Script Lab es una herramienta para crear rápidamente prototipos de código que llama a las API de biblioteca de JavaScript de Office. Script Lab es en sí mismo un complemento de Office y se puede instalar desde AppSource en Script Lab. Hay una versión para Excel, PowerPoint y Word, y una versión independiente para Outlook. Para obtener información sobre cómo usar Script Lab, consulte Exploración de la API de JavaScript de Office mediante Script Lab.

Pasos siguientes

Pruebe a crear su propio complemento o use Script Lab para probar ejemplos integrados.

Crear un complemento para Office

Puede crear rápidamente un complemento básico para Excel, OneNote, Outlook, PowerPoint, Project o Word siguiendo el inicio rápido de 5 minutos. Si ya ha completado un inicio rápido y quiere crear un complemento ligeramente más complejo, debe probar un tutorial.

Explorar las API con Script Lab

Explore la biblioteca de ejemplos integrados en Script Lab para tener una idea de lo que las API de JavaScript para Office son capaces de hacer.

Consulte también