DanWahlin / Angular-JumpStart

Angular and TypeScript JumpStart example application

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

npm run bundle throws error

vibrant-aaronstreate opened this issue · comments

When running the bundle script, an error is thrown. The same thing happens when running npm run bundle:prod.

`PS C:\Projects\Test\Angular2-JumpStart> npm run bundle

angular2-starter@0.9.0 bundle C:\Projects\Test\Angular2-JumpStart
node bundle.js

Unhandled rejection Error on fetch for app/main.js at file:///C:/Projects/Test/Angular2-JumpStart/app/main.js
Error: ENOENT, open 'C:\Projects\Test\Angular2-JumpStart\app\main.js'
at Error (native)`

+1

+1

By the way, this is really a good repo to understand the basics and is really very well built.

As per the error message, the path to main.js file that is been referred is wrong. It is supposed to look into '/src/app/main.js' instead of '/app/main.js'

Hi all.,

I have fixed the bundle failure issue. The project is getting bundled successfully now, but the website is not working :( :(

Attached is the screenshot of the errors :

image

In src/system.config.js file, change the app path in map attribute.

var map = {
    'app':                        'src/app', // 'dist',    <---- change to 'src/app' instead of 'app'
    'rxjs':                       'node_modules/rxjs',     [ no change ]
    '@angular':                   'node_modules/@angular'  [ no change ]
  };

Currently out on a business trip but will look at this when I get time. In the meantime, if you get it going please submit a pull request - I'd appreciate it.

Hi, I change also the path from 'app' to 'src/app' and prd bundle working now and local server also works correctly.

I'm also having this issue. The "src/app" workaround is not working for me. I get an error illegal operation on a directory, which seems to be SystemJS trying to read a directory as a file. The same happens whether I suffix the path with a / or not.

If I change it to "src/app/main.js", and I get an issue with the following paths:
no such file or directory, open '/Users/Meligy/Code/github/DanWahlin/Angular2-JumpStart/src/app/app.component'
Which seems like it doesn't append the ".js" as per the default extension in the config.

I think "app" is right though, matching the package name in the config file. But I'm getting errors on it as if it's the path.

OK, the following code creates a bundle for me:

var SystemBuilder = require('systemjs-builder');
var argv = require('yargs').argv;

var sourceDirName = 'src';
var sourcePath = './' + sourceDirName;

var builder = new SystemBuilder(sourcePath, sourcePath +  "/systemjs.config.js");

var outputFile = argv.prod ? './dist/bundle.min.js' : './dist/bundle.js';

builder.bundle('node_modules/*', {
    fetch: function (load, fetch) {
        load.address =
            load.address.replace(sourceDirName + "/node_modules", "node_modules");

        return fetch(load);
    }
});

builder.buildStatic('app', outputFile, {
    minify: argv.prod,
    mangle: argv.prod,
    rollup: argv.prod
});

But for some reason, the HTML files requested from components' templateUrls have the same paths unmodified.

For example, the browser tries to load /customers.component.html, instead of /app/customers/customers.component.html(note the /app/customers prefix).

It's probably because app/customers/customers.component.html is what is written inside the templateUrl, and this is what's requested relative to the main HTML file path, in this case /.

I got it fully working!

In src/systemjs.config.js:

Changed:

    'app':                        { main: 'main.js',  defaultExtension: 'js' },

to:

    'app':                        { main: 'main.js',  defaultExtension: 'js', encodeNames: false },

Works well with both runtime and bundle.