google-chrome-extension - 为 Google Chrome 扩展打包多个入口点

Question

我正在创建一个新的 Chrome 扩展程序。我引入了 Parcel bundler 用于模块捆绑和 TypeScript 支持。

我要建

/src
  /background-script
    index.ts
  /browser-action
    index.html
    index.ts
  /content-script
    index.ts

进入

/dist
  /background-script
    index.js
  /browser-action
    index.html
    index.js
  /content-script
    index.js

/src/index.html进口 index.ts在同一个目录

parcel watch src/background-script/index.ts src/content-script/index.ts src/browser-action/index.html --no-hmr --out-dir dist --public-url .

这将产生以下输出:

/dist
  /background-script
    index.js
  /browser-action
    index.html
  /content-script
    index.js
  browser-action.***.js

Answer 1

尝试在 package.json 中使用类似的东西:

"build": "parcel build ./src/**/main.js ./src/**/main.scss --out-dir build --no-content-hash --no-source-maps",

它将需要类似的东西:

/src
  /project1
    /components
      utils.js
      constants.js
    main.js

  /project2
    main.js

在projects1 main.js 导入utils.js 和constants.js 并做一些其他的事情。然后运行 ​​build 命令，它会缩小、polyfill、转换成/build 文件夹中的 main.js 文件。
并将生成一个文件夹结构，如:

/build
  /project1
    main.js
  /project2
    main.js