Symfony Encore不生成index.html及相对路径配置问题

一、让Symfony Encore重新生成index.html #

Symfony Encore默认不会自动生成index.html，需通过插件配置实现：

• 安装依赖：

  npm install html-webpack-plugin --save-dev
  

• 在项目根目录的webpack.config.js中添加插件配置：

  const HtmlWebpackPlugin = require('html-webpack-plugin');
  
  Encore
    // 保留原有其他配置（如addEntry、enableVueLoader等）
    .addPlugin(new HtmlWebpackPlugin({
      template: './assets/index.html', // 指向项目HTML模板，无模板则手动创建基础版
      filename: 'index.html', // 输出到public目录的文件名
      inject: true // 自动注入打包后的JS/CSS
    }))
  ;
  

• 执行npm run build，Encore会在public目录生成更新后的index.html。

二、配置相对路径适配IPFS #

实现类似npm build的homepage相对路径效果，调整Encore路径配置即可：

• 在webpack.config.js中设置公共路径为相对路径：

  Encore
    // 其他配置...
    .setPublicPath('./') // 将默认绝对公共路径改为相对路径
    .setManifestKeyPrefix('build/') // 保证manifest.json中资源路径前缀正确，避免资源找不到
  ;
  

• 检查HTML模板中的手动资源引用：若模板内有自定义的图片、字体路径，全部改为相对路径，或通过Encore资源加载器（如require('./image.png')）引入，让Encore自动处理路径。
• 构建完成后，确认public/index.html内所有JS/CSS引用路径均以./开头，确保IPFS部署后资源能正常加载。

内容的提问来源于stack exchange，提问作者Ritzy Dev