[vite:build-html] Unable to parse html in build step

Describe the bug

using vite with vite-plugin-string for importing html as strings dev mode works great, but when trying to build for production, we encounter the error below. the expected behavior is to not try to traverse all of my HTMLs as I don’t care if it’s valid or not. my index.html is perfectly valid but my other dozen HTML files that we import as strings are not all valid (in syntax).

[vite:build-html] Unable to parse {"file":"src/app/outer/register/register.html","line":1,"column":29}
1  |  export default "Already have an account?</a>\n                </div>\n            </div>\n\n        </div>\n    </form>\n</div>\n";
   |                              ^
file: src/app/outer/register/register.html
error during build:
Error: Unable to parse {"file":"src/app/outer/register/register.html","line":1,"column":29}
1  |  export default "Already have an account?</a>\n                </div>\n            </div>\n\n        </div>\n    </form>\n</div>\n";
   |                              ^
    at traverseHtml (/node_modules/vite/dist/node/chunks/dep-0ed4fbc0.js:24398:15)
    at async Object.transform (/node_modules/vite/dist/node/chunks/dep-0ed4fbc0.js:24453:17)
    at async ModuleLoader.addModuleSource (/node_modules/vite/node_modules/rollup/dist/shared/rollup.js:18616:30)
    at async ModuleLoader.fetchModule (/node_modules/vite/node_modules/rollup/dist/shared/rollup.js:18672:9)
    at async /vite/node_modules/rollup/dist/shared/rollup.js:18647:48
    at async Promise.all (index 3)
    at async ModuleLoader.fetchDynamicDependencies (/vite/node_modules/rollup/dist/shared/rollup.js:18637:30)
    at async Promise.all (index 1)
    at async ModuleLoader.fetchModule (/node_modules/vite/node_modules/rollup/dist/shared/rollup.js:18674:9)
    at async Promise.all (index 0)

Reproduction

using vite-plugin-string while importing broken html syntax that is not the index.html https://github.com/vitejs/vite/blob/4112c5d103673b83c50d446096086617dfaac5a3/packages/vite/src/node/plugins/html.ts#L153 basically should check only my index.html and not the rest of the HTML tree

System Info

System:
    OS: macOS 11.4
    CPU: (16) x64 Intel(R) Core(TM) i9-9980HK CPU @ 2.40GHz
    Memory: 5.09 GB / 32.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 15.6.0 - ~/.volta/tools/image/node/15.6.0/bin/node
    Yarn: 1.22.10 - ~/.volta/tools/image/yarn/1.22.10/bin/yarn
    npm: 7.19.0 - ~/.volta/tools/image/npm/7.19.0/bin/npm
  Browsers:
    Chrome: 91.0.4472.114
    Firefox: 84.0
    Safari: 14.1.1

Used Package Manager

yarn

Logs

vite:config using resolved config: {
  vite:config   root: '/app-frontend/src',
  vite:config   logLevel: 'info',
  vite:config   server: {
  vite:config     fsServe: { root: '/Users/***/****', strict: false }
  vite:config   },
  vite:config   resolve: {
  vite:config     dedupe: undefined,
  vite:config     alias: [
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object], [Object],
  vite:config       [Object], [Object]
  vite:config     ]
  vite:config   },
  vite:config   plugins: [
  vite:config     'alias',
  vite:config     'react-refresh',
  vite:config     'vite:dynamic-import-polyfill',
  vite:config     'vite:resolve',
  vite:config     'vite:html',
  vite:config     'vite:css',
  vite:config     'vite:esbuild',
  vite:config     'vite:json',
  vite:config     'vite:wasm',
  vite:config     'vite:worker',
  vite:config     'vite:asset',
  vite:config     'vite-plugin-string',
  vite:config     'vite-plugin-checker',
  vite:config     'vite:injectHtml',
  vite:config     'vite:define',
  vite:config     'vite:css-post',
  vite:config     'vite:build-html',
  vite:config     'commonjs',
  vite:config     'vite:data-uri',
  vite:config     'rollup-plugin-dynamic-import-variables',
  vite:config     'vite:import-analysis',
  vite:config     'vite:esbuild-transpile',
  vite:config     'vite:terser',
  vite:config     'vite:reporter'
  vite:config   ],
  vite:config   build: {
  vite:config     target: [ 'es2019', 'edge88', 'firefox78', 'chrome87', 'safari13.1' ],
  vite:config     polyfillDynamicImport: false,
  vite:config     outDir: 'dist',
  vite:config     assetsDir: 'assets',
  vite:config     assetsInlineLimit: 4096,
  vite:config     cssCodeSplit: true,
  vite:config     sourcemap: false,
  vite:config     rollupOptions: {},
  vite:config     commonjsOptions: { include: [Array], extensions: [Array] },
  vite:config     minify: 'terser',
  vite:config     terserOptions: {},
  vite:config     cleanCssOptions: {},
  vite:config     write: true,
  vite:config     emptyOutDir: null,
  vite:config     manifest: false,
  vite:config     lib: false,
  vite:config     ssr: false,
  vite:config     ssrManifest: false,
  vite:config     brotliSize: true,
  vite:config     chunkSizeWarningLimit: 500,
  vite:config     watch: null
  vite:config   },
  vite:config   configFile: '/app-frontend/vite.config.js',
  vite:config   configFileDependencies: [],
  vite:config   inlineConfig: {
  vite:config     root: undefined,
  vite:config     base: undefined,
  vite:config     mode: undefined,
  vite:config     configFile: undefined,
  vite:config     logLevel: undefined,
  vite:config     clearScreen: undefined,
  vite:config     build: {}
  vite:config   },
  vite:config   base: '/',
  vite:config   publicDir: '/app-frontend/src/public',
  vite:config   cacheDir: '/app-frontend/node_modules/.vite',
  vite:config   command: 'build',
  vite:config   mode: 'production',
  vite:config   isProduction: false,
  vite:config   env: { BASE_URL: '/', MODE: 'production', DEV: true, PROD: false },
  vite:config   assetsInclude: [Function: assetsInclude],
  vite:config   logger: {
  vite:config     hasWarned: false,
  vite:config     info: [Function: info],
  vite:config     warn: [Function: warn],
  vite:config     warnOnce: [Function: warnOnce],
  vite:config     error: [Function: error],
  vite:config     clearScreen: [Function: clearScreen]
  vite:config   },
  vite:config   createResolver: [Function: createResolver],
  vite:config   optimizeDeps: { esbuildOptions: { keepNames: undefined } }
  vite:config } +25ms

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn’t already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it’s a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.