.map sourcemap files missing from npm releases #2942

diuming · 2018-06-16T01:10:50Z

I'm a newbie with web technology?
The MDL is easy to use, but it's no longer to update.
The MDC-web is difficult for me and I can't find a step by step manual for general web server.
I always get errors when I run the code in general web server(like apache or nginx not for Nodejs).
Do I need to install nodjs, npm and webpack?
errors: (sorry: I don't have any experience with MDC-Web)

Cannot find module /dist/material-components-web.js.map in package [email protected]
Cannot find module /dist/material-components-web.js.map in package [email protected]

the code

<!DOCTYPE html>
<html>
    <head>
        <title>Material Components for the web-Drawer</title>
        <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
        <link rel="stylesheet" href="https://unpkg.com/material-components-web@latest/dist/material-components-web.min.css">
        <script src="https://unpkg.com/material-components-web@latest/dist/material-components-web.js"></script>
    </head>
    <body>
        <div>Toolbar goes here</div>
            <div class="content">
                <nav class="mdc-drawer mdc-drawer--permanent mdc-typography">
                    <nav id="icon-with-text-demo" class="mdc-list">
                        <a class="mdc-list-item mdc-list-item--activated" href="#">
                            <i class="material-icons mdc-list-item__graphic" aria-hidden="true">inbox</i>Inbox
                        </a>
                        <a class="mdc-list-item" href="#">
                            <i class="material-icons mdc-list-item__graphic" aria-hidden="true">star</i>Star
                        </a>
                    </nav>
            </nav>
            <main>
                Page content goes here.
            </main>
        </div>
    </body>
</html>

The text was updated successfully, but these errors were encountered:

kfranqueiro · 2018-06-18T20:17:21Z

This error is occurring because we don't include the .map files within our npm releases. I'm a bit surprised though, since I don't actually see this error in Chrome at all... I do see an error reported in Firefox, though.

This is mostly harmless, since the .map file is only used for debugging. There shouldn't be anything special you need to do server-side in order to use MDC Web, regardless of what web server you use.

However, it might be worth us considering including the .map files in each npm release. The only foreseeable downside is increased burden on bandwidth when first installing a new version of MDC Web packages via npm.

pavelsevcik · 2018-11-01T09:30:35Z

Dear @kfranqueiro,

can you either

A) include .map files in npm packages

or

B) disable map generation in prod build

reason is, that current setup where

material-components-web/scripts/webpack/js-bundle-factory.js

Line 78 in f310e73

devtool: 'source-map',

is

devtool: 'source-map',

and

material-components-web/scripts/cp-pkgs.js

Line 82 in f310e73

Promise.all(globSync('build/*.{css,js}').map(cpAsset)).catch((err) => {

is

Promise.all(globSync('build/*.{css,js}').map(cpAsset)).catch((err) => {

causing, that generated minified files ends with sourceMappingURL

/*# sourceMappingURL=mdc.drawer.min.css.map*/

but those files are not present in packages.

But that is causing for example build warnings when we use mdc with aurelia-cli

Error: An error occurred while trying to read the map file at /data/com__app/node_modules/@material/drawer/dist/mdc.drawer.js.map
Error: ENOENT: no such file or directory, open '/data/com__app/node_modules/@material/drawer/dist/mdc.drawer.js.map'
    at readFromFileMap (/data/com__app/node_modules/aurelia-cli/lib/build/convert-source-map/index.js:32:11)
    at new Converter (/data/com__app/node_modules/aurelia-cli/lib/build/convert-source-map/index.js:39:32)
    at Object.exports.fromMapFileComment (/data/com__app/node_modules/aurelia-cli/lib/build/convert-source-map/index.js:112:10)
    at Object.exports.fromMapFileSource (/data/com__app/node_modules/aurelia-cli/lib/build/convert-source-map/index.js:131:22)
    at acquireSourceMapForDependency (/data/com__app/node_modules/aurelia-cli/lib/build/bundle.js:200:33)
    at work.then (/data/com__app/node_modules/aurelia-cli/lib/build/bundle.js:222:25)
    at <anonymous>
    at process._tickDomainCallback (internal/process/next_tick.js:229:7)

it's just warning, but because we include mdc packages one by one we get tons of those warnings and that make aurelia-cli output bloated with noise and as that hard to read.

appreciate your time and efford required to solve this cosmetic issue

Pavel

pndewit · 2018-12-20T07:35:13Z

Having the same issue @pavelsevcik .. 😞

material-components#2942

pavelsevcik · 2018-12-21T03:17:42Z

@pndewit, I just submitted PR to add missing source-map files to npm releases

in meantime, try this quick and dirty hack of aurelia-cli in node_modules in your project (if you have aurelia-cli installed globaly hack code in global location)

add to <your-project-path>/node_modules/aurelia-cli/lib/build/bundle.js just right bellow first if in acquireSourceMapForDependency

  function acquireSourceMapForDependency(file) {
    if (!file || !file.path) {
      return;
    }

this quick and dirty hack to exclude @material packages source-map acquiring

    // WARNING: Hack / Workaround to supress Error: An error occurred while trying to read the map file
    if (/node_modules\/@material/.test(file.path)) return;

code gonna look like

function acquireSourceMapForDependency(file) {
    if (!file || !file.path) {
      return;
    }
    // WARNING: Hack / Workaround to supress Error: An error occurred while trying to read the map file
    if (/node_modules\/@material/.test(file.path)) return;

cheers

diuming changed the title ~~WDC example and how with Apache server~~ Does it possible to use MDC-web like MDL with general web server? Jun 18, 2018

material-components deleted a comment from matsp Jun 18, 2018

kfranqueiro changed the title ~~Does it possible to use MDC-web like MDL with general web server?~~ .map files missing from npm releases Jun 18, 2018

kfranqueiro added the backlog label Jun 21, 2018

kfranqueiro changed the title ~~.map files missing from npm releases~~ .map sourcemap files missing from npm releases Jul 18, 2018

kfranqueiro mentioned this issue Jul 18, 2018

missing js sourcemap files in version 0.35.0 #3129

Closed

abhiomkar mentioned this issue Nov 13, 2018

Unpkg material components map files 404 on Safari #4077

Closed

pavelsevcik pushed a commit to pavelsevcik/material-components-web that referenced this issue Dec 21, 2018

fix(package): Add source-map files to npm releases

e956fd3

material-components#2942

pavelsevcik mentioned this issue Dec 21, 2018

fix(package): Add source-map files to npm releases #4206

Merged

kfranqueiro closed this as completed in #4206 Jan 3, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

.map sourcemap files missing from npm releases #2942

.map sourcemap files missing from npm releases #2942

diuming commented Jun 16, 2018 •

edited

Loading

kfranqueiro commented Jun 18, 2018 •

edited

Loading

pavelsevcik commented Nov 1, 2018

pndewit commented Dec 20, 2018

pavelsevcik commented Dec 21, 2018

.map sourcemap files missing from npm releases #2942

.map sourcemap files missing from npm releases #2942

Comments

diuming commented Jun 16, 2018 • edited Loading

the code

kfranqueiro commented Jun 18, 2018 • edited Loading

pavelsevcik commented Nov 1, 2018

pndewit commented Dec 20, 2018

pavelsevcik commented Dec 21, 2018

diuming commented Jun 16, 2018 •

edited

Loading

kfranqueiro commented Jun 18, 2018 •

edited

Loading