generator-d365-ts-webresource
Version:
A simple scaffold to generate D365 WebResources in Typescript
60 lines (43 loc) • 2.12 kB
Markdown
# D365 TS WebResource Generator
This is a simple generator to create TypeScript-based Web Resources for Dynamics 365
inspired by [Scott Durow](https://github.com/scottdurow)'s
[Building JavaScript Web Resources using TypeScript](https://learn.develop1.net/courses/building-javascript-web-resources-using-typescript) course.
I recommend it to everyone I know, you should definitely take a look into it as it covers a lot more stuff than I added in this generator, then again this is a work in progress and more stuff will be added in the future.
## Getting Started
### Installation
- Install Yeoman
- Install this generator
- Run the generator in the target folder
``` cmd
npm install -g yo
npm install -g yo generator-d365-ts-webresource
yo generator-d365-ts-webresource
```
### Input
The generator will ask for
- _Namespace_: the recommended format is `Company.Client.Project`, but it's up to you
- _Compiled Web Resource Name_: `clienthooks` by default, you can change it to anything you like, it will always have the `.js` extension
## What you get
You get a project scaffold for building WebResources:
📦my_app_root
┣ 📂src
┃ ┣ 📂Form
┃ ┃ ┗ 📜AccountForm.ts
┃ ┣ 📂Ribbon
┃ ┃ ┗ 📜AccountRibbon.ts
┃ ┣ 📂services
┃ ┃ ┣ 📜EnvVarUtils.ts
┃ ┃ ┗ 📜FlowUtils.ts
┃ ┗ 📜index.ts
┣ 📜.eslintrc.json
┣ 📜.gitignore
┣ 📜.prettierrc.json
┣ 📜package.json
┣ 📜tsconfig.json
┣ 📜webpack.common.js
┣ 📜webpack.dev.js
┗ 📜webpack.prod.js
There are some basic configuration settings for EsLint, Prettier, and the TypeScript compiler.
In the end we use webpack to bundle all into a single file.
The point of entry file is the `src/index.ts`, there are samples on how to implement specific functionality for Forms and Ribbons.
As a bonus, on the `src/services` folder there are 2 utilities that I use on almost all my projects to deal with Environment Variables and triggering flows from the front end.