vue-cli has error

[wojiaoxiaomayun]

Environment

node 14.21.3
vue-cli:4.5.13
unplugin:1.3.1

Reproduction

this is my plugin;
@zkwq/unplugin-color-change

Describe the bug

Error: Child compilation failed:
Module parse failed: Unexpected token (1:0)
File was processed with these loaders:

• ./node_modules/unplugin/dist/webpack/loaders/transform.js
• ./node_modules/html-webpack-plugin/lib/loader.js
  You may need an additional loader to handle the result of these loaders.

|
| :
SyntaxError: Unexpected token (1:0)

• compiler.js:79
  [hky-profile-plus]/[html-webpack-plugin]/lib/compiler.js:79:16

• Compiler.js:343
  [hky-profile-plus]/[webpack]/lib/Compiler.js:343:11

• Compiler.js:681
  [hky-profile-plus]/[webpack]/lib/Compiler.js:681:15

• Hook.js:154 AsyncSeriesHook.lazyCompileHook
  [hky-profile-plus]/[tapable]/lib/Hook.js:154:20

• Compiler.js:678
  [hky-profile-plus]/[webpack]/lib/Compiler.js:678:31

• Hook.js:154 AsyncSeriesHook.lazyCompileHook
  [hky-profile-plus]/[tapable]/lib/Hook.js:154:20

• Compilation.js:1423
  [hky-profile-plus]/[webpack]/lib/Compilation.js:1423:35

• Hook.js:154 AsyncSeriesHook.lazyCompileHook
  [hky-profile-plus]/[tapable]/lib/Hook.js:154:20

• Compilation.js:1414
  [hky-profile-plus]/[webpack]/lib/Compilation.js:1414:32

• Hook.js:154 AsyncSeriesHook.lazyCompileHook
  [hky-profile-plus]/[tapable]/lib/Hook.js:154:20

• Compilation.js:1409
  [hky-profile-plus]/[webpack]/lib/Compilation.js:1409:36

Additional context

I put forward the issue yesterday. After waiting for the release of the new version, I immediately tested it. The result reported another error. I tested the remote package of the same version on vite. All the problems I felt were not the node version. If you need more details, please contact me

Logs

No response

[sxzz]

We temporarily close this due to the lack of enough information. Please provide a minimal reproduction to reopen the issue. Thanks.

https://antfu.me/posts/why-reproductions-are-required

[wojiaoxiaomayun]

https://gitee.com/xhlhehe/vue-cli-test
this is a demo
@sxzz

[sxzz]

Isn't @zkwq/unplugin-color-change an open-source project? Without source code, I'm unable to debug it.

[wojiaoxiaomayun]

unplugin-color-change.zip
this is code,it's so easy,I use TS because I want to create a compatibility package, but it's not very good at it. It's a bit poor in writing, so please forgive me.

[sxzz]

Please try to add transformInclude hook to exclude the HTML files which are not JavaScript code.

transformInclude(id) {
  return !id.endsWith('.html')
},

[wojiaoxiaomayun]

Thank you very much,is my code bug？or unplugin bug？please tell me ,I want to learn😁

[sxzz]

It's hard to say. I think unplugin should be compatible with this case. But we highly suggest that developers should add transformInclude and loadInclude to improve performance and avoid some unknown bugs.

Webpack's id filter is outside of loader logic; an additional hook is needed for better perf on Webpack. In Rollup and Vite, this hook has been polyfilled to match the behaviors. See for following usage examples.

[wojiaoxiaomayun]

Ok, I didn't take this into account. What I wanted was to replace the colors in all the files, and all of them didn't have blocking suffixes.

[wojiaoxiaomayun]

Actually, if you think about it carefully,. html should be blocked, because this is the only index.html for the vue project, and the rest are not (unless there are special circumstances).