Vulcanize does not resolve link to web-animation.js

Question

Vulcanize 1.14.7

I'm trying to use paper-dropdown-menu in a project. Using vulcanize on a components.html file which is imported into my index.html. Vulcanize correctly concatenates all the appropriate files except for the web-animations.js file. I get the following error in the browser console.

http://localhost:9005/bower_components/web-animations-js/web-        animations-next-lite.min.js 
Failed to load resource: the server responded with a status of 404 (Not Found)

This error originates from the vulcanized file.

<script src="../../bower_components/web-animations-js/web-animations-next-lite.min.js"></script>

just above the definition for opaque-animation

Polymer({

is: 'opaque-animation',

I am vulcanizing with gulp with the following config

gulp.task('web_components', () =>
 gulp.src(config.paths.webComponentIndex)
  .pipe(vulcanize({
    abspath: config.paths.dist,
    excludes: [],
    inlineScripts: true,
    stripExcludes: false
  }))
  .pipe(gulp.dest(config.paths.dist))
);

config.paths.dist is my dist directory and the webComponentIndex is of course the bundled output file which does bundle everything but this animation file correctly. If I understand this process correctly, that animations.js file should be concatenated along with everything else but it isn't doing it.

Answer 1

I had the same problem and solved it.

This problem occurs when vulcanize include bower_components\\neon-animation\\web-animations.html

And web-animations.html contains only one tag:

<script src="../web-animations-js/web-animations-next-lite.min.js"></script>

All you need is put parameter to your vulcanize when you run it from js inlineScripts or when you execute command --inline-scripts

This option will replace script tag by js file content. And it helps to include external sources to a bundle.

Are you sure that you have the web-animations-js folder in bower_components?