首页 > 解决方案 > 使用 vue-cli 在 typescript 中为 background.js 文件构建 chrome 扩展

问题描述

我正在开发一个基于vue-cli项目的 chrome 扩展。

我的项目结构是:

- dist/
-       /background.js
- public/
-       /background.js <-- how would i make this .ts
- src/
-    /main.ts
-    /App.vue

为了background.js在我的根目录中获取文件,我需要将它放在public.

但是vue-cli默认情况下构建 typescript(通过 webpack)的唯一位置是它是否在src目录中。

如何创建我的background.ts(打字稿)文件以使其构建到public目录中,同时保持目录中我的 Web 应用程序文件的结构src

这是tsconfig.json

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "strict": true,
    "jsx": "preserve",
    "importHelpers": true,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "baseUrl": ".",
    "types": [
      "webpack-env",
      "chrome"
    ],
    "paths": {
      "@/*": [
        "src/*"
      ]
    },
    "lib": [
      "esnext",
      "dom",
      "dom.iterable",
      "scripthost"
    ]
  },
  "include": [
    "src/**/*.ts",
    "src/**/*.vue",
    "tests/**/*.ts",
  ],
  "exclude": [
    "node_modules"
  ]
}

标签: javascripttypescriptvue.jsgoogle-chrome-extensionvue-cli

解决方案


推荐阅读