gulp build injects .map files into index.html and browser errors on their json

dman777 commented 7 years ago

Description

There is a major issue with source maps and I can not do a gulp build for production. After gulp build, the actual .map files will be injected instead of the concatenated .js files.

For instance, with the fountain default landing page for angular 1... when I try to load the dist/index.html, in chrome console I get:

vendor-36190f5b7d.js.map:1 Uncaught SyntaxError: Unexpected token :
app-4ecee42442.js.map:1 Uncaught SyntaxError: Unexpected token :

* This is even for the default landing page generated by the generator.

Error Message & Stack Trace

vendor-36190f5b7d.js.map:1 Uncaught SyntaxError: Unexpected token :
app-4ecee42442.js.map:1 Uncaught SyntaxError: Unexpected token :

Config

Copy the content from .yo-rc.json:

{
  "generator-fountain-angular1": {
    "version": "1.0.0-rc1",
    "props": {
      "framework": "angular1",
      "modules": "inject",
      "js": "js",
      "ci": [],
      "css": "scss",
      "resolved": "/home/one/.nvm/versions/node/v7.0.0/lib/node_modules/generator-fountain-webapp/node_modules/generator-fountain-angular1/generators/app/index.js",
      "namespace": "fountain-angular1",
      "argv": {
        "remain": [],
        "cooked": [],
        "original": []
      },
      "sample": "techs",
      "router": "none"
    }
  }
}

Relevant Links

If your project is public, link to the repo so we can investigate directly.
BONUS POINTS: Create a minimal reproduction and upload it to GitHub. This will get you the fastest support.
Environment

Tell us which operating system you are using, as well as which versions of Node.js, npm, and yo. Run the following to get it quickly:

one@localhost ~/github/ugh $ uname -a Linux localhost 4.0.5-gentoo #10 SMP Wed Feb 24 23:15:29 CST 2016 x86_64 Intel(R) Core(TM) i3 CPU M 350 @ 2.27GHz GenuineIntel GNU/Linux one@localhost ~/github/ugh $

one@localhost ~/github/ugh $ node -e "var os=require('os');console.log('Node.js ' + process.version + '\n' + os.platform() + ' ' + os.release())"
Node.js v7.0.0
linux 4.0.5-gentoo

one@localhost ~/github/ugh $ yo --version
1.8.5
one@localhost ~/github/ugh $ npm --version
3.10.8
one@localhost ~/github/ugh $ nvm list
->       v7.0.0
         system
default -> node (-> v7.0.0)
node -> stable (-> v7.0.0) (default)
stable -> 7.0 (-> v7.0.0) (default)
iojs -> N/A (default)
lts/* -> lts/boron (-> N/A)
lts/argon -> v4.6.1 (-> N/A)
lts/boron -> v6.9.1 (-> N/A)

ghost commented 7 years ago

I confirmed the problem and found something that appears to work with the sample app. (I don't use your configuration. I use webpack and babel. Also, I haven't updated to the latest fountainjs)

Look in gulp_tasks/build.js for the section of code that resembles this block and apply my changes, which have caps in the comments:

return gulp.src(conf.path.tmp('/index.html'))
    .pipe(inject(partialsInjectFile, partialsInjectOptions))
    .pipe(useref())
    .pipe(jsFilter)
    .pipe(sourcemaps.init())
    .pipe(ngAnnotate())
    .pipe(uglify({preserveComments: uglifySaveLicense})).on('error', conf.errorHandler('Uglify'))
    .pipe(rev())
    // .pipe(sourcemaps.write('maps'))    COMMENT THIS OUT
    .pipe(jsFilter.restore)
    .pipe(cssFilter)
    .pipe(sourcemaps.init())
    .pipe(cssnano())
    .pipe(rev())
    // .pipe(sourcemaps.write('maps'))      COMMENT THIS OUT
    .pipe(cssFilter.restore)
    .pipe(revReplace())
    .pipe(sourcemaps.write('maps'))     // ADD THIS HERE
    .pipe(htmlFilter)
    .pipe(htmlmin())
    .pipe(htmlFilter.restore)
    .pipe(gulp.dest(conf.path.dist()));
}

That appeared to get the sample app working for me. I didn't test it out beyond that. Hope this helps and good luck.

dman777 commented 7 years ago

Thank you so much!!! A billion times thanks!

FountainJS / generator-fountain-angular1