我想设置我的Webpack配置(v4 +)以排除引用本地库的导入。在我的应用中,我像这样导入该库:
/src/index.js
import foo from '../foo/foo'
console.log(foo);
/foo/foo.js
export default foo = "bar";
webpack.config.js
const path = require('path')
module.exports = {
entry: './src/index.js',
output: {
filename: 'main.js',
path: path.resolve(__dirname, 'dist')
},
externals: {
"foo": path.resolve(__dirname, "./foo/foo"),
}
};
但是,该库实际上已经在我部署应用程序的站点中全局引用。因此,我不希望该库与我的应用程序捆绑在一起(我仍然需要导入它,以便我可以正确无误地转换我的打字稿并使用智能感知。)
我发现我可以像这样通过使用externals属性轻松地将库从捆绑中排除:
module.exports = {
externals: {
"jquery": "jQuery"
}
}
我对导入的库执行相同的操作失败。我将如何去做呢?我尝试了以下操作,但该库仍包含在我的捆绑软件中:
我一直在研究文档,似乎只能找到与节点模块相关的示例,而对我的要求没有任何特定的示例。
如果您需要任何其他详细信息,请告诉我。提前致谢!
答案 0 :(得分:1)
为了使WebPack将您的导入视为外部,您的导入声明必须使用您在WebPack extenals
配置中定义的别名,而不是相对路径:>
import Foo from 'foo';
WebPack:
module.exports = {
externals: {
"foo": path.resolve(__dirname, "./path/to/foo")
}
}