https://www.plasmo.com/ logo
Join Discord
Powered by
# support-framework
  • a
    Copy code
    importScripts() is not supported in module workers
    s
    • 2
    • 1
  • m
    I keep getting 
    Unable to find any entrypoints
    error. I have enabled 
    verbose
    mode and found that 
    plasmo
    is not resolving/watching for 
    .tsx
    files. Is this a known bug?
    s
    • 2
    • 1
  • q
    @most-account-67892 has reached level 2. GG!
  • w
    Can we pack a crx directly from plasmo?
    s
    • 2
    • 1
  • m
    Looking at the 
    with-nextjs
    example, is there any way that I can put all of my Plasmo entry points (ie. 
    content.ts/background.ts
    ) inside 
    ./src/extension
    instead of cluttering the 
    ./src
    directory?
    s
    • 2
    • 1
  • t
    Apologies if I've missed this in the documentation: How would I create a "staging" build. ( I need three builds, dev, stage, prod). are development and production the only possible options as stated in the docs? More generally, what are people doing to share internal builds of their extensions with stakeholders? I've been building locally and sharing zip files, so I was hoping to have a separate build configuration for staging for fear or building and pushing a staging build up to the chrome store....
    s
    • 2
    • 1
  • b
    Hello, I'm trying to use Plasmo for a new extension at my company, but we work in an nx monorepo and I'm trying to get it all configured. Is it possible to yet configure the output location of the dev/production "builds"?
    s
    • 2
    • 1
  • t
    Another monorepo related question: Is it possible to get plasmo to automatically transpile dependencies? I would like to have "internal packages" as described here: https://turborepo.org/docs/handbook/sharing-code/internal-packages#6-configuring-your-app
    s
    • 2
    • 1
  • q
    @thousands-horse-90118 has reached level 4. GG!
  • r
    Apologies if this has been answered elsewhere (I did look around, but didn't find a clear answer)... **I'd like to programmatically inject a React component into a host page only when users click the extension icon. **Anyone else have any success? I tried the following hack with limited success: 1. Added a config export with the same entries for 
    matches
    and 
    exclude_matches
    to avoid the content script from automatically being injected into 
    <all_urls>
    2. Created a background script with a call to 
    chrome.scripting.executeScript
    on extension click:
    Copy code
    import reactRoot from 'url:./react-component';

chrome.action.onClicked.addListener((tab: chrome.tabs.Tab) => {
  chrome.scripting.executeScript(
    {
      target: { tabId: tab.id },
      files: [reactRoot.replace(/chrome-extension:\/\/[a-z]*\/([^?]*)\?.*/i, '$1')], // I think executeScript expects a path that is relative to the extension root...
    }
  )
});
    s
    • 2
    • 1
  • a
    thank you for the bpp v3 release - is there a guide on how to migrate from v2? what are the breaking changes that I'll need to adjust in my bpp keys and workflow yml?
    s
    • 2
    • 1
  • w
    How to keep consistent extension ID (chrome) when in development? We need a same ID because there is some communication needed from another web app.
    s
    • 2
    • 1
  • h
    Forgive my ignorance, but is there any easily accessible method for using sass with plasmo?
    s
    • 2
    • 1
  • a
    Copy code
    🔴 ERROR  | Unexpected token (parse-error)
          |  5:   // import { Selectors } from "~utils";
 6: 
 7:   export const config: PlasmoContentScript = {
                         ^
 8:     matches: ["https://steamcommunity.com/*"]
 9:   };
    by parsing
    Copy code
    html
<script context="module" lang="ts">
  import { PlasmoContentScript } from "plasmo";

  export const config: PlasmoContentScript = {
    matches: ["https://steamcommunity.com/*"]
  };
</script>
    s
    • 2
    • 1
  • a
    File structure:
    Copy code
    src
- content.svelte
    Copy code
    json
{
  "dependencies": {
    "plasmo": "0.56.0-alpha.0",
    "svelte": "^3.51.0"
  },
  "devDependencies": {
    "typescript": "4.8.4"
  }
}
    Copy code
    html
<script context="module" lang="ts">
  import type { PlasmoContentScript } from "plasmo";

  export const config: PlasmoContentScript = {};
</script>
    Getting error:
    Copy code
    🔴 ERROR  | Unexpected token (parse-error)
          | 1: <script context="module" lang="ts">     
2:   import type { PlasmoContentScript } from "plasmo";
                 ^
    s
    • 2
    • 1
  • m
    I need to access document._activeElement.__data.data I think in order to do that I need to inject a script in order to have access to it. How do I inject a script?
    s
    • 2
    • 1
  • m
    So in order to get access to the "main world" I need to inject a script into the page. I have a few questions for this procedure. 1. because i use chrome injection will the extention only be able to run on chromium based browsers? And also how do i communicate between the injected script and my content script?
    s
    • 2
    • 1
  • w
    can we have multiple environments? In dev and build commands, plasmo is replacing the 
    NODE_ENV
    variable to development and production respectively. Is there any way to override these OR code change would be needed?
    s
    • 2
    • 1
  • a
  • c
    Ok, this time Im stumped and I've been stuck on this for a few hours now... Why does my 
    chrome.runtime
    have nothing in it?
    s
    l
    • 3
    • 10
  • c
    I've added these permissisons:
    s
    • 2
    • 2
  • s
    Thread automatically created by TD in #978320682985349130
    • 1
    • 1
  • b
    Hi all! anyone managed to get eval() working with Plasmo and Manifest V3?
    s
    • 2
    • 1
  • c
    Hello guys. My name is Sávio, I'm from Brazil and I'm using Plasmo for my graduation project. I'm using cucumber and puppeteer to perform the extension's e2e tests and locally I can make it work. But I would like to enable a Github action to run these tests at the time of pull requests. I tried to use this action (https://github.com/mujo-code/puppeteer-headful) but when entering the page this error is triggered: Error: net::ERR_BLOCKED_BY_CLIENT at chrome-extension://. Thank you in advance for your attention and if you can help. Repository: https://github.com/bingobongo-testing/extension.
    s
    • 2
    • 1
  • f
    Hey, long time no see. I've been making some changes, but I'm having issues with React and lazy loading components. Particularly, I'm getting an error because React seems to request a css file that apparently doesn't exist when trying to lazy load a component. Has anyone any experience with React 
    React.lazy
    and 
    React.suspense
    in a plasmo extension? Here's the particular error I'm getting.
    Copy code
    css-loader.js:32          GET chrome-extension://gdjdodhempghlamfmddaepeofepfhnbd/linkedin.09792b32.css?1666624251495 net::ERR_FILE_NOT_FOUND
    s
    • 2
    • 2
  • p
    Hey guys, I have a weird behavior with tailwind. In a monorepo I have a nextjs app and an extension each with their own tailwind config with color overrides. Both configs include content from a shared library package. And the color overrides (affecting the library components as well) are only showing up on the nextjs app. Using the library components in the content script (react) are not affected by the colors. I assume the compiled css delivered through the extension somehow doesn’t include the proper colors. Do you have any pointers for me where to start debugging this?
    s
    • 2
    • 1
  • r
    Hi there! Does Plasmo offer a method for creating extensions to enhance browser's Developer Tools?
    s
    • 2
    • 1
  • m
    Is there an example of how to use 
    "paths"
    in 
    tsconfig.json
    with Plasmo. Trying to set the following, but its not working.
    Copy code
    "compilerOptions": {
  "baseUrl": ".",
  "paths": {
    "@/*": ["./src/*"],
    "~*": ["./src/*"]
  }
}
    s
    • 2
    • 2
  • w
    Hello, im having some issues with the inline csui in some urls it will mount my component directly but in some other sites it will wait for a dom change (When I inject another extension by clicking on its icon my inline csui will be mounted) the csiu code:
    Copy code
    ts
import type { PlasmoContentScript, PlasmoGetInlineAnchor } from "plasmo"

export const config: PlasmoContentScript = {
  matches: ["<all_urls>"]
}

export const getInlineAnchor: PlasmoGetInlineAnchor = () =>
  document.querySelector("body")

// Use this to optimize unmount lookups
export const getShadowHostId = () => "plasmo-inline-example-unique-id"

const PlasmoInline = () => {
  return <div style={{backgroundColor:"red"}}>Custom div</div>
}

export default PlasmoInline
    s
    • 2
    • 2
  • a
    Hello folks, we are considering Plasmo for our extension(on MV3 already). I would like to know what would be the best way to port our current extension to Plasmo framework. Thanks.
    s
    l
    • 3
    • 3