1350223 - alias for all images path in webpack.config

Status: RESOLVED FIXED

(DevTools :: Netmonitor, enhancement, P1)

Description

[[e-mail]]

to Require correct png, svg in css

Comment 1

[Ricky Chien [:rickychien] (inactive)]

Attachment: Bug 1350223 - alias for all images path in webpack.config

Review commit: https://reviewboard.mozilla.org/r/125472/diff/#index_header
See other reviews: https://reviewboard.mozilla.org/r/125472/

Comment 2

[Ricky Chien [:rickychien] (inactive)]

Finally I figured out that webpack NormalModuleReplacementPlugin is a cool solution for dealing with chrome:// resource:// protocol so it's very likely to the way of resolve.alias.

Right now, I can see all assets (svg, png) in css files are bundled properly. STR to verify all images are resolved:

1. yarn start 

and see webpack log and images are bundles without throwing any error.

Comment 3

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8853354 [details]
Bug 1350223 - alias for all images path in webpack.config

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/125472/diff/1-2/

Comment 4

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Just wanted to review this but, I am unable to load Netmonitor in Launchpad due to the following errors:

Console Service ERROR [JavaScript Error: "TypeError: LocalizationHelper is not a constructor" {file: "http://localhost:8000/assets/build/netmonitor.js" line: 100718}] [JavaScript Error: "TypeError: LocalizationHelper is not a constructor" {file: "http://localhost:8000/assets/build/netmonitor.js" line: 100718}]

L10N was disabled?
https://github.com/devtools-html/devtools-core/commit/ba74d5ab990affdae5ee39b573239d83154e17f0

Also there is new Stack Trace side-panel (bug 1350234):

ERROR in ./src/components/stack-trace-panel.js
Module not found: Error: Cannot resolve module 'devtools/client/shared/components/stack-trace' in C:\src\mozilla.org\mozilla-central\devtools\client\netmonitor\src\components@ ./src/components/stack-trace-panel.js 16:33-89

Do we have to move this to devtools-core/devtools-modules package?

Honza

Comment 5

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8853354 [details]
Bug 1350223 - alias for all images path in webpack.config

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/125472/diff/2-3/

Comment 6

[Ricky Chien [:rickychien] (inactive)]

(In reply to Jan Honza Odvarko [:Honza] from comment #4)
> Just wanted to review this but, I am unable to load Netmonitor in Launchpad
> due to the following errors:
> 
> Console Service ERROR [JavaScript Error: "TypeError: LocalizationHelper is
> not a constructor" {file: "http://localhost:8000/assets/build/netmonitor.js"
> line: 100718}] [JavaScript Error: "TypeError: LocalizationHelper is not a
> constructor" {file: "http://localhost:8000/assets/build/netmonitor.js" line:
> 100718}]
> 
> L10N was disabled?
> https://github.com/devtools-html/devtools-core/commit/
> ba74d5ab990affdae5ee39b573239d83154e17f0

Yes, you can re-enable it but it's irrelevant to this bug. 


> Also there is new Stack Trace side-panel (bug 1350234):
> 
> ERROR in ./src/components/stack-trace-panel.js
> Module not found: Error: Cannot resolve module
> 'devtools/client/shared/components/stack-trace' in
> C:\src\mozilla.org\mozilla-
> central\devtools\client\netmonitor\src\components@
> ./src/components/stack-trace-panel.js 16:33-89
> 
> Do we have to move this to devtools-core/devtools-modules package?

Yep, new PR for devtools-core will be opened soon. 

See comment 2, this bug targets on "alias for all images path in webpack.config" so you can verify that by doing STR in comment 2 and see assets of webpack log are resolved properly.

Bug 1352699 is doing the thing that make netmonitor run on browser (like our experiment repo), so only thing we should verify here is that: 

Get rid of all webpack module resolve errors after removing //require("src/assets/style/netmonitor.css") in index.js.

Comment 7

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8853354 [details]
Bug 1350223 - alias for all images path in webpack.config

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/125472/diff/3-4/

Comment 8

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8853354 [details]
Bug 1350223 - alias for all images path in webpack.config

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/125472/diff/4-5/

Comment 9

[Ricky Chien [:rickychien] (inactive)]

Comment on attachment 8853354 [details]
Bug 1350223 - alias for all images path in webpack.config

Review request updated; see interdiff: https://reviewboard.mozilla.org/r/125472/diff/5-6/

Comment 10

[Ricky Chien [:rickychien] (inactive)]

Updated patch for fixing stace-trace component errors and open PR for exporting StaceTrace property in devtools-module (https://github.com/devtools-html/devtools-core/pull/310).

Honza, you can check my patch again and remember to update devtools-core once https://github.com/devtools-html/devtools-core/pull/310 is landed.

Comment 11

[Ricky Chien [:rickychien] (inactive)]

Note that splitbox has been moved from devtools-modules to devtools-splitter https://github.com/devtools-html/devtools-core/pull/308/files.

Folow-up update will be fixed in bug 1352699.

Comment 12

[Ricky Chien [:rickychien] (inactive)]

The easiest way to verify images asset is try to make webpack throw error.

We can simply remove `"devtools/client/framework/devtools": "devtools-modules"` in webpack.config.js and then see images chunk are bundled properly.

Comment 13

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Comment on attachment 8853354 [details]
Bug 1350223 - alias for all images path in webpack.config

https://reviewboard.mozilla.org/r/125472/#review129496

I don't see any troubles on my machine.

Thanks!
Honza

Comment 14

[Jan Honza Odvarko [:Honza] (always need-info? me)]

Just removing NI

Honza

Comment 15

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/9cfa45d5cf0c
alias for all images path in webpack.config r=Honza

Comment 16

[Wes Kocher (:KWierso) (Not reading bugmail; email directly if needed)]

https://hg.mozilla.org/mozilla-central/rev/9cfa45d5cf0c