Skip to content
This repository has been archived by the owner on Apr 9, 2021. It is now read-only.

one bundle is missing sometimes #5

Open
firsttris opened this issue Mar 5, 2019 · 14 comments
Open

one bundle is missing sometimes #5

firsttris opened this issue Mar 5, 2019 · 14 comments

Comments

@firsttris
Copy link
Owner

sometimes when we do builds, either the modern or the legacy bundle is missing.

in index.html there is just and empty script tage like this

<script type="module"></script>

not quite sure why this happens.

is this because the plugin is using an async tab?

if you have an idea please reply

regards
Tristan

@itaditya
Copy link

happening with me too.

@johnstew
Copy link

johnstew commented Mar 26, 2019

Hey just following up here. This was the output of my latest attempt.

<!DOCTYPE html>
<html>
  <head>
    <title>Webpack App</title>
    
     
  </head>
  <body>
 
  <script type="module">
            
  </script>

    <script nomodule>
            
                var script0 = document.createElement('script');
                script0.type = 'text/javascript';
                script0.src = 'index_legacy.js';
                document.body.appendChild(script0);
            
    </script>
    
  <script type="text/javascript" src="index_legacy.js"></script></body>
</html>

It looks like this.js is not persisting through the lifecycle of the plugin. It's being created fresh each time beforeHtmlGeneration is being called.

I'm not entirely sure of the correct solution here. I'm not all that familiar with webpack plugins. I'll see if I can take a closer look soon.

Code for reference: johnstew/differential-serving#2

@Akiyamka
Copy link

It's look crazy, sometime build work fine, but most of time i got just

    <script type="module"></script>
    <script nomodule></script>

=(

@firsttris
Copy link
Owner Author

@Akiyamka have you noticed any improvement / decline from version 1.1.0 in comperence to 1.0.0 ?

@Akiyamka
Copy link

@firsttris I started with 1.1.0 version already

@Akiyamka
Copy link

Akiyamka commented Jun 25, 2019

@firsttris html-webpack-plugin-before-html-generation hook run twice and generate index.html twice - empty and filled version. (I see it in log)
If webpaсk run builds in parallel is a matter of luck which of them will be written in dist last

@Akiyamka
Copy link

Akiyamka commented Jun 25, 2019

So I found next workaround for that issue -
in first build config i change filename option to 'delete_me.html' and use ignore-emit-webpack-plugin for ignore that file in emit stage.

{
  plugins: [
    new htmlWebpackPlugin({
      inject: !multiBuildMode,
      template,
      filename: '__delete_me__.html',
    }),
    new IgnoreEmitPlugin('__delete_me__.html'),
    new htmlWebpackMultiBuildPlugin()
  ]
}

Now index.html is generated as needed

@firsttris
Copy link
Owner Author

@Akiyamka well done. good catch.
So the Issue is because it's executed twice and one is empty.
i will add this to the doc's.

@carlesnunez
Copy link

We are having some problems with the plugin too. Sometimes it put only the output of one of the configs used. Any help that you could provide will be welcome

@carlesnunez
Copy link

I think that I have an overview idea about what's happening and I have a fix proposal in order to avoid this. It is as you said caused by a twice execution of the html-webpack execution. Which is colliding one vs each other trying to write the file (if is called with the same name). I'll post a fix proposal based into only take into account the last beforeHtmlCreation to call the cb method.

@carlesnunez
Copy link

First of all I'm not so experienced with webpack plugins but... makes sense to do something like that?

    beforeHtmlGeneration: function(data, cb) {
        this.js = this.js.concat(data.assets.js);
        data.assets.js = this.js;
        data.plugin.options.modernScripts = this.js.filter((value) => value.indexOf('legacy') === -1);
        data.plugin.options.legacyScripts = this.js.filter((value) => value.indexOf('legacy') > 0);
        !this.firstTime ? cb(null, data) : (this.FirstTime = false);
    },

which will be the affectations of not call the cb method on first execution of the plugin? I've tested it and seem to work well but... As I said I'm not an expert about webpack plugins under the hood

@carlesnunez
Copy link

@firsttris you know which are the affectations of this?

@firsttris
Copy link
Owner Author

firsttris commented Jul 25, 2019

i really don't now. probably my xp with webpack plugins is not better then yours, or even worse

if your fix works it would be a nice solution.

first question which came to my mind:
is "this" still existing event if its executed twice?

if this fixes the build issue i would be happy to add this code...

@hbinkle
Copy link

hbinkle commented Mar 25, 2020

any updates on this?
Since I updated to the latest versions of webpack and the html plugins all bundles are missing on every build

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

6 participants