Activities

zombieJ

zombieJ posted a new question

webpackbar •

DeprecationWarning: Tapable.plugin is deprecated

Version

3.1.3

Reproduction link

https://github.com/nuxt/webpackbar

Steps to reproduce

update webpack to 4.
(Seems webpack 4 updated the plugin interface.)

What is expected ?

No warning log

What is actually happening?

(node:89719) DeprecationWarning: Tapable.plugin is deprecated. Use new API on `.hooks` instead
    at WebpackBarPlugin.apply (/projects/antd/rc-antd/node_modules/[email protected]3.12.0@webpack/lib/ProgressPlugin.js:59:13)
    at WebpackBarPlugin.apply (/projects/antd/rc-antd/node_modules/[email protected]3.1.3@webpackbar/dist/plugin.js:158:11)
    at webpack (/projects/antd/rc-antd/node_modules/[email protected]4.27.1@webpack/lib/webpack.js:47:13)
    at options.map.options (/projects/antd/rc-antd/node_modules/[email protected]4.27.1@webpack/lib/webpack.js:35:55)
    at Array.map (<anonymous>)
    at webpack (/projects/antd/rc-antd/node_modules/[email protected]4.27.1@webpack/lib/webpack.js:35:40)
    at dist (/projects/antd/rc-antd/node_modules/[email protected]6.1.0@antd-tools/lib/gulpfile.js:40:3)
    at Gulp.gulp.task.done (/projects/antd/rc-antd/node_modules/[email protected]6.1.0@antd-tools/lib/gulpfile.js:102:3)
    at module.exports (/projects/antd/rc-antd/node_modules/_orchestrator@[email protected]orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/projects/antd/rc-antd/node_modules/[email protected]0.3.8@orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/projects/antd/rc-antd/node_modules/[email protected]0.3.8@orchestrator/index.js:214:10)
    at Gulp.Orchestrator.start (/projects/antd/rc-antd/node_modules/[email protected]0.3.8@orchestrator/index.js:134:8)
    at Object.<anonymous> (/projects/antd/rc-antd/node_modules/[email protected]6.1.0@antd-tools/lib/cli/run.js:25:8)
    at Module._compile (module.js:652:30)
    at Object.Module._extensions..js (module.js:663:10)
    at Module.load (module.js:565:32)
Airkro

Airkro posted a new bug report

webpackbar •

bug falling when terminal width < 120

Version

v3.0.0

Steps to reproduce

use in webpack 4.x

What is expected ?

run normally

What is actually happening?

abc.gif

alerg

alerg posted a new question

webpackbar •

Crash in next build -> Error: Cannot find module 'ajv/lib/compile/equal'

"next": "7.0.2"
----"webpack": "4.20.2"
--------"webpackbar": "2.6.3"
------------"table": "4.0.3"

The dependency "table" that has "webpackbar" installs dependencies with the prefix ^. One of its dependencies removed code that caused the next build process to be broken:

Error: Cannot find module 'ajv/lib/compile/equal'
at Function.Module.resolveFilename (module.js:547:15) at Function.Module.load (module.js:474:25)
at Module.require (module.js:596:17)
at require (internal/module.js:11:18)
at Object.<anonymous> (/nodemodules/table/dist/validateConfig.js:2:13) at Module.compile (module.js:652:30)
at Object.Module.extensions..js (module.js:663:10) at Module.load (module.js:565:32) at tryModuleLoad (module.js:505:12) at Function.Module.load (module.js:497:3)

iKonrad

iKonrad posted a new question

webpackbar •

Running two webpack configs simultaneously

Hey. This is more of a question than a bug I suppose.

So I've got a client and a server configs for webpack, and both are run simultaneously with npm-run-all.

Both configs have their own webpackbar plugins, but since both webpack builds are run independently at the same time, both progress bars are fighting for the same position which results in a flickering effect between them.

What would be the correct way to set this up to show two sidebars one above another?

manniL

manniL posted a new bug report

webpackbar •

bug Duplicate bars on webpack error

Version

v3.0.0

Reproduction link

https://github.com/manniL/lichter.io

Steps to reproduce

webpackbar-duplicated-bars

  1. Download latest master version (linked above)
  2. Install deps
  3. Run yarn generate
    Happens in WebStorm terminal but also in normal Gnome Terminal. (Running Ubuntu LTS)

What is expected ?

No duplicate Client bar

What is actually happening?

Duplicate bar

emersonlaurentino

emersonlaurentino posted a new question

webpackbar •

Cannot read property 'tap' of undefined

node: 8.12.0
webpack: 4.21.0

(node:19004) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'tap' of undefined
(node:19004) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
(node:19004) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
emersonlaurentino

emersonlaurentino posted a new question

webpackbar •

Cannot read property 'tap' of undefined

node: 8.12.0
webpack: 4.21.0

(node:19004) UnhandledPromiseRejectionWarning: TypeError: Cannot read property 'tap' of undefined
(node:19004) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)
(node:19004) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
abenhamdine

abenhamdine posted a new bug report

webpackbar •

bug Error "Cannot convert undefined or null to object" after upgrade from 2.6.3 to 3.0.x

Version

v3.0.3

Reproduction link

https://github.com/nuxt/webpackbar

Steps to reproduce

Build a project with create-react-app, webpack 3 and react-app-rewired, with following config-override :

module.exports = {
    webpack: function (config, env) {

        config.plugins = (config.plugins || []).concat([
            new WebpackBar({
                profile: true,
            })
        ])

        return config

    }
}

Or way to reproduce the issue : run tests for ant-design project (https://github.com/ant-design/ant-design) with npm run dist.
See CI failure here : https://circleci.com/gh/ant-design/ant-design/24699?utm_campaign=vcs-integration-link&utm_medium=referral&utm_source=github-build-link.
The upgrade has been reverted since by this commit : https://github.com/ant-design/ant-design/commit/5204b45e01e91026c8cc63dba343b1c67ca8f7a0

What is expected ?

No error

What is actually happening?

Error Cannot convert undefined or null to object

myeveryheart

myeveryheart posted a new question

webpackbar •

No Stats

update to 3.0.0, There's no Stats by Ext or Stats by Loader.
But 2.5.0 is fine.

Aghassi

Aghassi posted a new feature request

webpackbar •

idea Have same formatting output as Listr (or make it an option)

What problem does this feature solve?

This is a really minor nit, but this formatting drives me crazy
Screen Shot 2018-11-07 at 4.49.52 PM.png

As far as I'm aware, I'm not sure if your new custom reporters will solve this problem. All I want is for the checkmarks to line up and not to have that new line above. I'm combining your module with https://github.com/SamVerschueren/listr in tandem, hence the concern. This has literally zero effect on the actual use of this repo. I just want to align the outputs 😭.

What does the proposed changes look like?

Remove the new line​ above the completed step
Align the checkmark with a single space indentation

anton164

anton164 posted a new question

webpackbar •

Add stats for minification time and plugins

This issue is for a:

  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> bug
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;" checked> feature request
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> modification request

New Feature Use Case

Currently the only output shown is this:

Stats by Ext

╔════════╤══════════╤═══════╤══════════════╤══════════════════╗
║ Ext    │ Requests │ Time  │ Time/Request │ Description      ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ js     │ 111212s   │ 11ms         │ JavaScript files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ jsx    │ 3692s    │ 5ms          │ jsx files        ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ hbs    │ 2953s    │ 11ms         │ hbs files        ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ less   │ 45641ms │ 14ms         │ less files       ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ less 019853μs │ 45μs         │ less 0 files     ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ css 013561μs │ 43μs         │ css 0 files      ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ svg    │ 13ms   │ 3ms          │ svg files        ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ css    │ 353ms  │ 18ms         │ css files        ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ Total  │ 185718s   │              │                  ║
╚════════╧══════════╧═══════╧══════════════╧══════════════════╝


Stats by Loader

╔═══════════════════╤══════════╤═══════╤══════════════╤═══════════════════╗
║ Loader            │ Requests │ Time  │ Time/Request │ Description       ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ babel-loader      │ 145014s   │ 9ms          │ Babel Loader      ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ handlebars-loader │ 2953s    │ 11ms         │ Handlebars Loader ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ expose-loader     │ 15ms   │ 5ms          │ Expose Loader     ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ css-loader        │ 80696ms │ 9ms          │ Css Loader        ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ postcss-loader    │ 68695ms │ 10ms         │ Postcss Loader    ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ less-loader       │ 64642ms │ 10ms         │ Less Loader       ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ exports-loader    │ 29316ms │ 11ms         │ Exports Loader    ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ imports-loader    │ 19256ms │ 13ms         │ Imports Loader    ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ raw-loader        │ 13ms   │ 3ms          │ Raw Loader        ║
╟───────────────────┼──────────┼───────┼──────────────┼───────────────────╢
║ Total             │ 200719s   │              │                   ║
╚═══════════════════╧══════════╧═══════╧══════════════╧═══════════════════╝

However, a lot of the webpack build time is also spent in minification and plugins, would it be possible to add that info?

Pitu

Pitu posted a new question

webpackbar •

When serving nuxt in a development enviroment, the webpack UI gets messed up.
  • Operating System: Windows 10 1803
  • Node Version: v10.8.0
  • NPM Version: 6.2.0
  • webpack Version: Whatever comes with [email protected]
  • webpack-serve Version: Whatever comes with [email protected]

This issue is for a:

  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;" checked> bug
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> feature request
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> modification request

Code

CLI Command
  $ nuxt

Expected Behavior

When using the command next it compiles, clears the console on most cases and then it shows you the ip and port where your app is being served on.

Actual Behavior

Lots of text gets left behind, progressbars don't even complete and it fails to show ip and port as shown on the following picture:

How Do We Reproduce?

Just by running the command nuxt.

ovidius72

ovidius72 posted a new question

webpackbar •

Questions

Congratulation for this very nice and useful plugin.
I wanted to know if it's possible to configure the plugin in some way to have the following:
1) show the dev server host only when the first build is completed.
e.g. "The application is running at http://localhost:8080"
I don't want to show on subsequent builds.

2) Is it possible to only see the colored progress bar without the information about the build ?

thanks

manniL

manniL resolved the question #c8

webpackbar •

Are there any examples about multiple concurrent builds (SSR) ?

Nuxt is using webpackbar for SSR and CSR builds in its latest nuxt-edge releases.

rustjason

rustjason posted a new question

webpackbar •

feature request

I have an ideal for the profile part, currently, the incremental build time is accumulative. How about we add option to display time cost for each build?

I can submit a PR if you like.

mherodev

mherodev posted a new bug report

webpackbar •

bug Bars aren't filling completely before rendering success

image

  • Operating System: OSX
  • Node Version: 8.11.3
  • NPM Version: 5.6
  • webpack Version: 4ish
  • webpack-serve Version: Unknown

This issue is for a:

  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;" checked> bug
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> feature request
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> modification request

Code

webpack.config.js

https://github.com/lucleray/next-progressbar

Expected Behavior

Bar to be filled completely

Actual Behavior

Bars are partially filled before reporting success

How Do We Reproduce?

https://github.com/lucleray/next-progressbar

mherodev

mherodev posted a new question

webpackbar •

Bars aren't filling completely before rendering success

image

Not sure if this is intended behavior or not. Related ticket: https://github.com/lucleray/next-progressbar/issues/4#issuecomment-407702276

joacim-boive

joacim-boive posted a new question

webpackbar •

Duplicated profiling information in the console
  • Operating System: Windows 7
  • Node Version: 8.9.4
  • NPM Version: 5.6.0
  • webpack Version: 4.16
  • webpack-serve Version: 2.0.2

This issue is for a:

  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;" checked> bug
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> feature request
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> modification request

Code

webpack.config.js
  plugins: [
                new WebpackBar({
                    profile: true,
                    minimal: false,
                    compiledIn: false,
                    done
                }),
                new HardSourceWebpackPlugin(),
                new HtmlWebpackPlugin({
                    ...htmlDefault,
                    env: 'development',
                    filename: 'index.html',
                }),
]

Expected Behavior

I expect to see the profile information only once in the console.

Actual Behavior

The profiling information is outputted before Webpack is done.
So, it first appears in the middle of compiling and then again once Webpack is done.

The done callback is also called twice - but both times (looking at the stats object) webpack says it's done….

How Do We Reproduce?

This is what the output looks like:

i 「serve」: Serving Static Content from: src\lib\config\parts\
i 「hot」: WebSocket Server Listening on 172.25.14.140:55368
i 「serve」: Project is running at http://172.25.14.140:5600
i 「serve」: Server URI copied to clipboard
[hardsource:133d4ee0] Using 43 MB of disk space.
[hardsource:133d4ee0] Writing new cache 133d4ee0…
[hardsource:133d4ee0] Tracking node dependencies with: package-lock.json.

Stats by Ext

╔════════╤══════════╤═══════╤══════════════╤══════════════════╗
║ Ext │ Requests │ Time │ Time/Request │ Description ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ js │ 1 │ 33ms │ 33ms │ JavaScript files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ scss │ 10 │ 752ms │ 75ms │ SASS files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ scss 0 │ 1 │ 69μs │ 69μs │ scss 0 files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ Total │ 12 │ 785ms │ │ ║
╚════════╧══════════╧═══════╧══════════════╧══════════════════╝

Stats by Loader

╔════════════════════╤══════════╤═══════╤══════════════╤════════════════════╗
║ Loader │ Requests │ Time │ Time/Request │ Description ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ babel-loader │ 1 │ 33ms │ 33ms │ Babel Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ css-loader │ 11 │ 752ms │ 68ms │ Css Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ postcss-loader │ 11 │ 752ms │ 68ms │ Postcss Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ resolve-url-loader │ 11 │ 752ms │ 68ms │ Resolve Url Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ sass-loader │ 11 │ 752ms │ 68ms │ Sass Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ Total │ 45 │ 3s │ │ ║
╚════════════════════╧══════════╧═══════╧══════════════╧════════════════════╝

 Access project at:     

http://172.25.14.140:5600

✔︎ Webpack compiled in: 1335ms
[hardsource:66f4e04f] Using 43 MB of disk space.
[hardsource:66f4e04f] Writing new cache 66f4e04f…
[hardsource:66f4e04f] Tracking node dependencies with: package-lock.json.
i 「hot」: Applying DefinePlugin:hotClientOptions
i 「hot」: webpack: Compiling…

Stats by Ext

╔════════╤══════════╤═══════╤══════════════╤══════════════════╗
║ Ext │ Requests │ Time │ Time/Request │ Description ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ js │ 2 │ 34ms │ 17ms │ JavaScript files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ scss │ 19 │ 878ms │ 46ms │ SASS files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ scss 0 │ 2 │ 113μs │ 56μs │ scss 0 files ║
╟────────┼──────────┼───────┼──────────────┼──────────────────╢
║ Total │ 23 │ 912ms │ │ ║
╚════════╧══════════╧═══════╧══════════════╧══════════════════╝

Stats by Loader

╔════════════════════╤══════════╤═══════╤══════════════╤════════════════════╗
║ Loader │ Requests │ Time │ Time/Request │ Description ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ babel-loader │ 2 │ 34ms │ 17ms │ Babel Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ css-loader │ 21 │ 878ms │ 42ms │ Css Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ postcss-loader │ 21 │ 878ms │ 42ms │ Postcss Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ resolve-url-loader │ 21 │ 878ms │ 42ms │ Resolve Url Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ sass-loader │ 21 │ 878ms │ 42ms │ Sass Loader ║
╟────────────────────┼──────────┼───────┼──────────────┼────────────────────╢
║ Total │ 86 │ 4s │ │ ║
╚════════════════════╧══════════╧═══════╧══════════════╧════════════════════╝

 Access project at:     

http://172.25.14.140:5600

i 「hot」: webpack: Compiling Done

wuweijia

wuweijia posted a new question

webpackbar •

Why is the CSS bundle file "comm.css" at the end of the nuxt package, It's not supposed to be in front ?

now

page.css /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ normalize.css

i want

normalize.css /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ page.css

thomaseizinger

thomaseizinger posted a new bug report

webpackbar •

bug ESLint is broken as soon as WebpackBar is added as a plugin
  • Operating System: Ubuntu
  • Node Version: 9.9.0
  • NPM Version: 5.6.0
  • webpack Version: 4.6.0
  • eslint Version: 4.19.1
  • webpack-serve Version: -

This issue is for a:

  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;" checked> bug
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> feature request
  • <input type="checkbox" disabled style="margin: 0px 0.35em 0.25em -1.6em; vertical-align: middle;"> modification request

Code

CLI Command
yarn run lint
webpack.config.js

https://github.com/nobt-io/frontend/blob/f71c5079d3b35a1389ce5d7425c090b1963a9823/webpack.config.js

.eslintrc.js

https://github.com/nobt-io/frontend/blob/f71c5079d3b35a1389ce5d7425c090b1963a9823/.eslintrc.js

Expected Behavior

ESLint runs as usual

Actual Behavior

ESLint reports at lot of errors because it fails to resolve imports

How Do We Reproduce?

  • git clone https://github.com/nobt-io/frontend
  • git checkout feature/webpackbar
  • yarn install
  • yarn run lint

Lint fails.

  • git checkout HEAD^1
  • yarn run lint

Lint succeeds.

If you look at the commit, nothing else is changed besides adding the webpackbar plugin.
I think it has something do with the referencing the webpack config in .eslintrc.js. However, I don't understand why adding WebpackBar changes any of that.