Parcel: HTML bundles must only contain one asset

[edenprojectde]

❔ Question

Has there been any changes to parcel from 1->2 which disable usage of different kind of file extensions in one file?
Maybe somebody know what exactly this message wants to tell me so i can change it? unsure if this is a bug or just me.

🔦 Context

My Project uses pug and ES6 imports.
I would get you more info but "--log-level verbose" gives me the same error using this:
parcel index.pug --log-level verbose

V1 compiled fine, i changed to V2 to get ES6 imports working because script(defer='', type="module", src='/js/main.js') seem to not be loaded correctly in broswer because of pracelRequire.

I tried streamlining so i only use one kind of asset per type (sass => scss for ex.) didnt change the error for me.

💻 Code Sample

ben@EdenTheFourthVII:~/Projekte/Kunde/Heimatvoll/Server2/frontend$ parcel index.pug 
Server running at http://localhost:1234
🚨 @parcel/packager-html: HTML bundles must only contain one asset
AssertionError [ERR_ASSERTION]: HTML bundles must only contain one asset
    at Object.package (/home/ben/.nvm/versions/node/v12.10.0/lib/node_modules/parcel/node_modules/@parcel/packager-html/lib/H
TMLPackager.js:34:21)
    at PackagerRunner.package (/home/ben/.nvm/versions/node/v12.10.0/lib/node_modules/parcel/node_modules/@parcel/core/lib/Pa
ckagerRunner.js:214:36)
    at async PackagerRunner.getBundleResult (/home/ben/.nvm/versions/node/v12.10.0/lib/node_modules/parcel/node_modules/@parc
el/core/lib/PackagerRunner.js:182:20)
    at async PackagerRunner.packageAndWriteBundle (/home/ben/.nvm/versions/node/v12.10.0/lib/node_modules/parcel/node_modules
/@parcel/core/lib/PackagerRunner.js:151:9)
    at async Child.handleRequest (/home/ben/.nvm/versions/node/v12.10.0/lib/node_modules/parcel/node_modules/@parcel/workers/
lib/child.js:162:9)

🌍 Your Environment

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 2.0.0-alpha.3.2
| Node | 12.10.0
| npm/Yarn | [email protected]
| Operating System | KDE Neon (User:18)

[mischnic]

Can you post your complete pug file?

[edenprojectde]

./layout/index.pug

meta(charset='utf-8')
meta(name="viewport" content="width=device-width, initial-scale=1")
meta(http-equiv='X-UA-Compatible', content='IE=edge')
link(rel='manifest' href='manifest.webmanifest')
title Heimatvoll
link(rel='preload', href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css' as="stylesheet")
link(rel='stylesheet', href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css')
link(rel='stylesheet', href='/css/main.sass')
link(href='https://fonts.googleapis.com/css?family=Open+Sans', rel='stylesheet')
link(rel='icon', type='image/png', sizes='32x32', href='./img/icons/icon-ldpi.png')
script(defer='',src='/js/localforage.js')
script(defer='', type="module", src='/js/main.js')
base(href="/")
- var ssr = rendering=="ssr"
- var mobile = !!!mobile
- var debug = false
if !ssr
    script(defer='', type="module", src='/js/router.js')

index.pug

extends ./layout/index.pug

block content
  if !ssr
    #newest.container(limit="6")

  section.section
    if ssr
      #newest.container!=newest

    br
    .container
      if ssr
        #categories(start="0", columnwidth="4", limit="9")!=categories
      else 
        #categories(start="0", columnwidth="4", limit="9")

[mischnic]

Please provide a complete reproduction

[edenprojectde]

Can you specify what a complete reproduction is?

[mischnic]

All files that are needed to make Parcel throw the error you specified.

In this case, using the files you posted results in an error by pug, because there is no block content in layout/index.pug. After resolving that, Parcel build successfully.

[edenprojectde]

frontend.zip
Here is a Snapshot of the current frontend

I changed the file of the main layout (index.pug) to default.pug in the hope that the error happens because of some kind of flattening issue.

[mischnic]

Interesting, I think this is somehow caused by the circluar dependency from index.pug to navbar to index.pug.

Minimal example:

//- index.pug
html
  body
    include nav-top.pug
    div(style="min-height:60px;")

//- nav-top.pug
a.navbar-item(href="/index.pug")
  b Startseite

Bundle Graph:

The HTMLPackager wants to bundle both the CSS and HTML part of the pug into a single HTML bundle.

Bundle Graph without nav-bar, CSS and HTML clearly get their own bundle:

[andreidmt]

I'm getting the same error with the default scenario:

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="./index.css" />
  </head>
  <body>
    <div id="react-root"></div>
    <script src="./index.jsx"></script>
  </body>
</html>

If I remove the css from index.html and import it in index.jsx with import "./index.css", it works as intended.

Env

| Software | Version(s) |
| ---------------- | ---------- |
| Parcel | 2.0.0-alpha.3.2
| Node | 12.13.1
| npm/Yarn | [email protected]
| Operating System | Arch Linux x86_64