アドインプロジェクトを作成するには、Visual Studio CodeでOffice Add-ins Development Kitを使用します。プロンプトに従い、プロジェクトを作成するためのフォルダを選択します。作成されたプロジェクトには、基本的なタスクペインアドイン用のサンプルコードが含まれています。プロジェクトの設定は./manifest.xmlまたは./manifest.jsonで確認できます。ローカルサーバーを起動し、Excelでアドインをテストします。問題が発生した場合は、オフィスのインスタンスを閉じ、開発エラーのトラブルシューティングを参照してください。
Officeアドイン開発入門
前提条件
Officeアドインを開発するには、以下の条件を満たす必要があります。
- Node.js（最新のLTSバージョン）。Node.jsサイトから、オペレーティングシステムに適したバージョンをダウンロードしてインストールします。
-
YeomanおよびYeoman Generator for Office Add-insの最新バージョン。これらのツールをグローバルにインストールするには、コマンドプロンプトで以下のコマンドを実行します。
npm install -g yo generator-office - Microsoft 365のサブスクリプションに接続されたOffice（ウェブ版を含む）。
アドインプロジェクトの作成
Yeomanジェネレーターを使用してアドインプロジェクトを作成するために、以下のコマンドを実行します。これにより、現在のディレクトリにプロジェクト用のフォルダーが追加されます。
yo officeこのコマンドを実行すると、YeomanおよびOffice Add-in CLIツールのデータ収集ポリシーに関するプロンプトが表示される場合があります。表示される情報に従って、プロンプトに応答します。
プロンプトに従い、以下の情報を提供してアドインプロジェクトを作成します。
- プロジェクトの種類を選択:
Office Add-in Task Pane project - スクリプトの種類を選択:
Javascript - アドインの名前:
My Office Add-in - サポートするOfficeクライアントアプリケーション:
Excel
ウィザードを完了すると、ジェネレーターがプロジェクトを作成し、必要なNodeコンポーネントをインストールします。
プロジェクトの探索
Yeomanジェネレーターで作成したアドインプロジェクトには、基本的なタスクペインアドインのサンプルコードが含まれています。プロジェクトのコンポーネントを探索するには、コードエディタでプロジェクトを開き、以下のファイルを確認してください。
./manifest.xmlまたは./manifest.json– アドインの設定および機能を定義します。./src/taskpane/taskpane.html– タスクペインのHTMLマークアップが含まれます。./src/taskpane/taskpane.css– タスクペイン内のコンテンツに適用されるCSSが含まれます。./src/taskpane/taskpane.js– タスクペインとOfficeクライアントアプリケーションとの間の相互作用を容易にするOffice JavaScript APIコードが含まれます。
アドインを試す
-
プロジェクトのルートフォルダに移動します。
cd "My Office Add-in" -
次のコマンドを実行してローカルウェブサーバーを開始し、アドインをサイドロードします。
npm start
Excelを開くと、アドインが読み込まれます。そして、Excelのホームタブでタスクペインを表示ボタンを選択してアドインタスクペインを開きます。
次に、ワークシート内のいずれかのセル範囲を選択し、タスクペインの下部にある実行リンクを選択すると、選択した範囲の色が黄色に設定されます。
テストの停止
アドインのテストとデバッグが完了したら、次の手順でアドインを常に閉じてください（Officeアプリケーションやウェブサーバーウィンドウを閉じるだけではアドインを確実に登録解除できません）。
- Officeアドイン開発キットのアイコンを選択して拡張機能を開きます。
- アドインのプレビューを停止を選択します。これによりウェブサーバーが閉じられ、アドインがレジストリおよびキャッシュから削除されます。
- Officeアプリケーションウィンドウを閉じます。
トラブルシューティング
アドインを実行する際に問題が発生した場合は、次の手順を試してください。
- 開いているOfficeインスタンスをすべて閉じます。
- 前回のアドイン用に起動したウェブサーバーをアドインのプレビューを停止オプションで閉じます。
アドインの開発エラーをトラブルシューティングする方法について、こちらの記事を参照してください。
次のステップ
おめでとうございます！Excelタスクペインアドインを成功裏に作成しました。次に、Excelアドインのチュートリアルに従い、Excelアドインの機能について詳しく学び、より複雑なアドインを構築してみましょう。
————-
Build your first Excel task pane add-in – Office Add-ins
Source link
Summary: Creating and Testing an Office Add-in Project
Prerequisites:
- Node.js: Ensure you have the latest LTS version installed.
- Yeoman and Generator: Install Yeoman and the Office Add-ins generator globally using:
npm install -g yo generator-office - Office Subscription: You need Office connected to a Microsoft 365 subscription.
Create the Add-in Project:
-
Use the Office Add-ins Development Kit for Visual Studio Code or the Yeoman generator to create your add-in.
- For VS Code:
- Click the create project button; if the extension isn’t installed, follow prompts.
-
Select the directory for your new project and let the development kit generate it.
- For Yeoman:
- Run
yo officein your command prompt. - Follow interactive prompts to choose task pane project type, script type, add-in name, and supported Office application.
Explore the Project:
- Your generated project will include:
- manifest.xml or manifest.json: Settings and capabilities.
- taskpane.html: HTML markup for the task pane.
- taskpane.css: CSS for styling.
- taskpane.js: JavaScript API code for functionality.
Test the Add-in:
- Open the Office Add-ins Development Kit icon.
- Select Preview Your Office Add-in and choose the appropriate Office application.
- First-time launches may take time to install dependencies and require certificate installations.
Stop Testing:
- To stop the add-in:
- Use the Office Add-ins Development Kit’s Stop Previewing option and close the Office app.
Troubleshooting:
- If errors arise, ensure no Office instances are open and stop any prior web server instances.
- Consult troubleshooting resources or open a GitHub issue for assistance.
Next Steps:
- Once successfully created, you can explore more about Excel add-in capabilities and follow further tutorials to enhance your understanding and skills in Office Add-in development.
コメント