2

Trying to do an chrome extension with angular2 and typescript, I am stuck in how to get access to the chrome API (chrome.bookmarks in particular).

I do have access to the chrome object by following angular2 chrome extension chrome.runtime.sendMessage from typescript

But even though I can access to chrome, I cannot to chrome.bookmarks

manifest.json

{
    "manifest_version": 2,
    "name": "x",
    "short_name": "x",
    "description": "x",
    "version": "0.1.0",
    "author": "x",
    "permissions": [
        "bookmarks",
        "https://ajax.googleapis.com/"
    ]
}

And then, it seems that I should be accessing chrome through @types as suggested here Using chrome extension apis in typescript

But I can't find how. Should I import what? import { Chrome, filesystem, filewriter } from '@types'; ? I'm lost here, and I cannot find documentation about that (what makes me believe it is not a good idea to use angular2 for a chrome extension)

Community
  • 1
  • 1
GWorking
  • 4,011
  • 10
  • 49
  • 90

1 Answers1

4

The chrome service is made available to your app at run time (when in the browser), and you don't have (or actually can't import it). What worked for me was to declare a var to avoid compilation errors:

declare var chrome;

and then in each code segment that deals with chrome, to first check if it exists (to avoid dev time crashes):

funcThatUsesChrome(args) {
   if(chrome){
      chrome.doSomeAction();
   }
}
Meir
  • 14,081
  • 4
  • 39
  • 47
  • 1
    You mean when in the browser as an extension? Because the app does run in a browser (localhost:3000). And, what's the way to user @types/chrome? – GWorking Jan 05 '17 at 06:26
  • Yes, this is what I mean. Chrome is available only when your app is ran as an extension. I'm not familiar with the @types/chrome solution. – Meir Jan 05 '17 at 06:32