Manifest V3 - can one use Typescript code in Chrome Manfest V3 Extensions

[Howard Ricketts]

I have a large body of C# code that I would like to port to Typescript rather than Javascript as I am much more comfortable with strongly typed languages.  Is it acceptable to develop a Chromium in Typescript?

[Jackie Han]

Any language that can be compiled into JavaScript is OK.

Chrome Extension = Standard Web + Extension API

On Wed, Jan 20, 2021 at 4:58 AM Howard Ricketts <how...@softcase.co.uk> wrote:

I have a large body of C# code that I would like to port to Typescript rather than Javascript as I am much more comfortable with strongly typed languages.  Is it acceptable to develop a Chromium in Typescript?

--
You received this message because you are subscribed to the Google Groups "Chromium Extensions" group.
To unsubscribe from this group and stop receiving emails from it, send an email to chromium-extens...@chromium.org.
To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/856c6733-2a74-433b-ae2f-092af0898ef4n%40chromium.org.

--

韩国恺(Jackie)

[Jackie Han]

In addition

We're also now publishing an automatically generated TypeScript Definition file to npm. If you build a Chrome Extension with tools like VSCode, you can depend on chrome-types to benefit from autocompletion. This npm package is published automatically and will pick up changes right from Chromium source.

Ref:https://developer.chrome.com/blog/welcome/

--

韩国恺(Jackie)

[Jon Howard]

My manifest v3 extension is written using Typescript and I just use webpack to transpile it to vanilla JS.

[Simon Bassu]

Great! 

But how does it work? I've installed the npm, but no autocompletion is available in VSCode.

I've certainly misconfig something...

Help will be appreciated

Thank you,

SB

To view this discussion on the web visit https://groups.google.com/a/chromium.org/d/msgid/chromium-extensions/CAAgdh1L%2BCcitopKVxehTR4pUYm5%2B%3DXxxZHuBBx175gqfyZwLNw%40mail.gmail.com.

[Jackie Han]

Simon,

I see there are 'index.d.ts' and 'platform_app.d.ts' in 'node_modules/chrome-types'.

I am not familiar with typescript,  anyone else could help?

Or report question to https://github.com/GoogleChrome/chrome-types 

--

韩国恺(Jackie)

[Simeon Vincent]

Simon,

How are you installing the chrome-types package? I installed it in my project directory and VS Code picked it up without any special configuration. Here's what I just did just now to verify things were working as expected.

1. cd to a test project directory.

2. npm init -y to create a new package.json with default values

3. npm i --save-dev chrome-types to install chrome-types in this project's directory (and add the dependency to package.json)

4. code . to open VS Code in this directory

5. Create a new js file (e.g. background.js) in this directory, open it for editing, and start typing something like chrome.action.

You should see IntelliSense kick in as you type the word action. If you don't, you might need to give VS Code a couple seconds to initialize TypeScript language features. If that doesn't work, IDK 🤷

Cheers,

Simeon - @dotproto

Chrome Extensions DevRel

[Simon Bassu]

Thank you, Simeon! 

It works!

[Ben Dehghan]

Can you please share a simple version of a typescript extension? something like a very basic example that actually builds. I've been trying to build an angular app and can't seem to be able to build it so that it installs with webpack.

It'd be a great help :)

Thanks,

Ben

[T-Chi]

Hi, is this still the way to do it? I initially used `npm i -D @types/chrome` from DefinitelyTyped and it didn't work, then I tried this and it doesn't work either.

I have this line in my package.json:
```

"chrome-types": "^0.1.120",

```
which says it's installed successfully.
Any other solutions to get this working?
Say I need the type HistoryItem (https://github.com/DefinitelyTyped/DefinitelyTyped/blob/efee424bc5c51cdf5d349ed7df810074db0aa253/types/chrome/index.d.ts#L4480), how do I access it in my code? (It's not visible in the global scope.)