在另一个 webpack 项目中使用 webpack 编译的库并且没有导入任何内容

Question

假设我有两个项目：

project-a

export default "test text"

project-a使用默认的 webpack 4.0 配置进行编译，该配置将/src/index.js其打包到/dist/main.js.

然后我将它保存到我的 github 或 npm 中，以便我将来可以使用它（就像在项目-b 中一样）。

package.json 看起来像：

{
  "name": "project-a",
  "version": "1.0.0",
  "description": "my project",
  "main": "./dist/main.js",
  "dependencies": {},
  "devDependencies": {
    ...
  },
  "scripts": {
    ...
  },
  "author": "",
  "license": "ISC"
}

---

project-b

我首先运行：

npm install mygithub/project-a

然后使用相同的默认 webpack 4.0 配置创建一个/src/index.js：

import projectDefault from 'project-a'

console.log(projectDefault)

我明白了{}。尝试import * as projectA from 'project-a'产量{}

我哪里错了？

Answer 1

如果你想编写某种可重用的库，你必须告诉 webpack 这样做。

output: {
  libraryTarget: 'commonjs2',
  library: 'handler',
  filename: 'index.js',
  path: path('build')
},

这是重要的部分。在这里，您告诉 webpack 您希望它构建一个库。

以我的alexa-skill-template项目为例。它导出方法句柄。

进一步阅读：

• https://webpack.js.org/configuration/output/#output-librarytarget
• https://webpack.js.org/configuration/output/#output-library