Question

友我试图将外部文件保留在Webpack包之外，但仍保留为依赖项 - 在这种情况下是一个设置文件。我尝试了以下几种变体 -

externals: {
  'Settings': JSON.stringify(require('./settings.json'))
},

...但是Webpack会将其包含在捆绑包中。我在文档中找到的唯一例子是常见的预设，如jQuery，没有提到本地但外部文件。救命？谢谢！

Answer 1

怎么样？

// Outside of webpack context
var fs = require("fs");
var settings = JSON.parse(fs.readFileSync('./settings.json', 'utf8'));

// Within webpack context
externals: {
  'Settings': settings
}

Answer 2

因此经过大量研究后，在编写此答案时，获取外部文件的唯一方法是在某种程度上忽略Webpack并简单地向index.html添加另一个脚本调用。这就是我最终做的事情 -

<body>
    <div id="whatever-app-id"></div>
    <script type="text/javascript" src="settings.js"></script>
    <script type="text/javascript" src="app.js" defer></script>
</body>

为了更好地衡量，您还可以参考在settings.js文件中声明的全局对象，添加@gmaliar回答中提到的webpack外部。然而，这有点多余，因为无论如何对象都是全局的。

希望它能帮助任何人。

Webpack - 外部JS / JSON文件作为依赖项

2 个答案: