异常值:字符串索引必须是整数:Render bundle错误vue+django

Question

im使用webpack加载程序将我的vue应用程序插入django，代码如下：

设置：

WEBPACK_LOADER = {
'DEFAULT':{
'BUNDLE_DIR_NAME':'/',
'STATS_FILE':os.path.join(BASE_DIR,'aptim-frontend/dist','webpack-stats.json')
}}

vue配置文件：

const BundleTracker = require("webpack-bundle-tracker"); 
module.exports = {
// on Windows you might want to set publicPath: "http://127.0.0.1:8080/"
publicPath: "http://0.0.0.0:8080/",
outputDir: "./dist/",
chainWebpack: (config) => {
config.optimization.splitChunks(false);
config
.plugin("BundleTracker")
.use(BundleTracker, [{ filename: "../frontend/webpack-stats.json" }]);
config.resolve.alias.set("__STATIC__", "static");
config.devServer
.public("http://0.0.0.0:8080")
.host("0.0.0.0")
.port(8080)
.hotOnly(true)
.watchOptions({ poll: 1000 })
.https(false)
.headers({ "Access-Control-Allow-Origin": ["*"] });},};

我得到错误的html行在html 索引处

{% render_bundle 'app' %}

错误：异常值：字符串索引必须是整数

Answer 1

我在伟大的Udemy课程Django REST框架和Vue JS的完整指南中遇到了同样的问题。如果你没有订阅，你可能无法阅读米歇尔·萨巴的答案。

这可能与软件包版本有关，而且它们是alpha。降级到

• webpack-bundle-tracker@0.4.3
• django webpack加载程序==0.7.0

对我有用。降级使用：

npm install --save-dev webpack-bundle-tracker@0.4.3

Answer 2

@Frans 告知的降级Webpack捆绑包跟踪器

npm install --save-dev webpack-bundle-tracker@0.4.3

在vue.config.js中

config
.plugin('BundleTracker')
.use(BundleTracker, [{filename: './webpack-stats.json'}])

然后用旧的webpack-stats.json删除dist文件夹

在此版本中，使用此配置，webpack-stats.json文件在frontend中生成，而不是在frontend/dist中生成所以您必须在settings.py中更改STATS_FILE(例如，如果您的Vue项目是frontend(

'STATS_FILE': os.path.join(BASE_DIR, 'frontend','webpack-stats.json'),

然后重新启动Vue和Django web服务器。

Answer 3

异常值：字符串索引必须是整数

我也遇到了这个奇怪的错误，确认降级为webpack-bundle-tracker@0.4.3作品