vue-loader with vue-html-loader not work

[ovo4096]

Problem

I would like to enable html interpolate, but not work.

Webpack config

{
  test: /\.vue$/,
  loader: 'vue-loader',
  options: { 
    loaders:
    {
      css: { ... },
      html: 'vue-html-loader?interpolate'
    } 
  }
}

Errors

 error  in ./Xxx.vue
(Emitted value instead of an instance of Error)
  Error compiling template:
  module.exports = "\n<div>\n</div>\n";
  - text "module.exports = "\n" outside root element will be ignored.

[ovo4096]

367

In previous versions, it can work. But now can not work, this is why?

[LinusBorg]

This rather seems like your template is not formatted correctly.

Please provide a runnable reproduction.

[roshecode]

@ovo4096 Hello! Help me please! I have the same issue. How did you fix your problem?

[seanwash]

@ma1oy exactly the same issue? It from the example above it looks like the template wasn't formatted properly, there shouldn't be anything outside of the root dom element.

[BrainBacon]

The issue I had was using pug: ['html-loader', 'pug-html-loader']. Substitute html-loader with vue-html-loader and the problem persists. If you are in a similar situation, just use pug: 'pug-html-loader' in your loader options. vue-loader is expecting a simple string of html and html-loader returns a script.

[WarrenXia]

Maybe because<template lang="html">,just use <template>

[Nisus-Liu]

I also encountered the same problem, and I use <template> in instead of <template lang="html"> work. Although, inner <style></style> can't have anything..... That depressed.

[RobbyAJM]

FFS! Thanks to @WarrenXia , I just waste my 5 hours just because of that ****.