OfficeDev / Office-Addin-TaskPane-Angular

Template to get start started writing a TaskPane Office Add-in for the Angular framework using TypeScript
Other
14 stars 19 forks source link

Angular cli support #93

Open igor-ribeiiro opened 2 years ago

igor-ribeiiro commented 2 years ago

Updated project to now support angular-CLI commands. The CLI can be accessed by npm run ng.

Many files were rearranged as Angular CLI requires a specific project structure. To help the reviewers, I didn't change any .ts or .html other than references to files in other places.

So most of the relevant changes are in the configuration files (.json).

  1. Do these changes impact any npm scripts commands (in package.json)? (e.g., running 'npm run start') If Yes, briefly describe what is impacted.

There is now a new npm run ng command to access the Angular CLI.

  1. Do these changes impact VS Code debugging options (launch.json)? No

  2. Do these changes impact template output? (e.g., add/remove file, update file location, update file contents) Yes, as files places were changed.

  3. Do these changes impact documentation? (e.g., a tutorial on https://docs.microsoft.com/en-us/office/dev/add-ins/overview/office-add-ins) Maybe, some reference to Angular CLI and the npm run ng command could be added, but not needed.

If you answered yes to any of these please do the following:

Include 'Rick-Kirkham' in the review Make sure the README file is correct

Validation/testing performed:

Tested npm run test for unit and e2e test. Tested npm run start and tested debugging. All of them working.

millerds commented 2 years ago

This is going to take a while to process. I don't know that we decided to do such an invasive change, but rather look at what it would be like.

igor-ribeiiro commented 2 years ago

This is going to take a while to process. I don't know that we decided to do such an invasive change, but rather look at what it would be like.

I thought we decided to do a POC of what the project would look like. Here is the POC :D

millerds commented 2 years ago

This is going to take a while to process. I don't know that we decided to do such an invasive change, but rather look at what it would be like.

I thought we decided to do a POC of what the project would look like. Here is the POC :D

Right . . . but the POC shouldn't be checked in on top of the live template code. This should be in a branch or just a draft PR.

igor-ribeiiro commented 2 years ago

Sure, added an angular branch so the changes would go there instead.

igor-ribeiiro commented 2 years ago

Why are the pipeline files removed? My mistake putted them back

Why are the assets getting moved? Why move the taskpane folder contents up a directory? Angular expects a specific project structure. I tried making the CLI work with our current structure with no success. Then I resorted to copying what the angular CLI templates give us. I think this is defined in the angular.json file, but I couldn't change it so it could work with the old file structure.

I also found that the style sheet is not getting applied at runtime because of the mime type. What do you mean by "mime" type?

igor-ribeiiro commented 2 years ago

Hey @millerds the PR should be ready to review again. As I note, I removed the unit tests because I could not get them to work in Angular 14 for some days now (that's why I previously was trying to use Angular 12).

As those unit tests are exactly equal to the ones used in the Task pane repo, I decided it wasn't worth it anymore to keep spending time trying to fix them.

millerds commented 2 years ago

If current version of Angular can't be made to support Edge Legacy, I'm not sure this something we can support as it affects some fairly current versions of office. Customers would be spending time on add-ins that only work on the most current versions of office and then when they went to look at compatibility find out the that the platform they are built on doesn't support the required versions of office.