New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Package.js compiler build error - Attempting to combine different files #8222

Closed
Akryum opened this Issue Jan 6, 2017 · 10 comments

Comments

Projects
None yet
3 participants
@Akryum

Akryum commented Jan 6, 2017

Using Meteor: 1.4.2.3

When building the meteor vue2 example (that uses akryum:vue-component compiler), I get the following error:

 Attempting to combine different files:
{ type: 'js',
  sourcePath: 'client/ui/MyButton.vue',
  servePath: 'client/ui/MyButton.vue',
  installPath: 'client/ui/MyButton.vue',
  deps: { './MyButton.vue.css': {} },
  lazy: true,
  data: <Buffer 6d 6f 64 75 6c 65 2e 65 78 70 6f 72 74 73 20 3d 20 72 65 71 75 69 72 65 28 22 2e 2f 4d 79 42 75 74 74 6f 6e 2e 76 75 65 2e 63 73 73 22 29 3b 0a>,
  hash: '87396daab2a8f710bd9c28aafab7e060bd574270' }
{ type: 'js',
  data: <Buffer 76 61 72 20 5f 5f 76 75 65 5f 73 63 72 69 70 74 5f 5f 2c 20 5f 5f 76 75 65 5f 74 65 6d 70 6c 61 74 65 5f 5f 3b 5f 5f 76 75 65 5f 73 63 72 69 70 74 5f ... >,
  sourcePath: 'client/ui/MyButton.vue',
  targetPath: 'client/ui/MyButton.vue',
  servePath: '/client/ui/MyButton.vue',
  hash: '1ce08740ecc69a68045f3e5055bec1d70ef539b0',
...

This is very likely to be caused by the fact that the vue compiler use both addJavaScript and addStylesheet on inputFiles (vue components can embed style): L205 and L224.

Everything is working great in development since I don't use addStylesheet and send the styles via websocket instead (part of the hot-module-replacement features of akryum:vue-component).

I found several related closed issues, like this one, #6881 or #7859, but the problem seems to be still present in the latest meteor version.

See: #101

@MartinBucko

This comment has been minimized.

MartinBucko commented Jan 6, 2017

@Akryum its possible to fix that with downgrade some of packages? Thanks

@Akryum

This comment has been minimized.

Akryum commented Jan 6, 2017

I don't know if it doesn't comes from a particular version of Meteor, since I didn't change the code mentioned above for some time (and I've successfully run an app in production mode some months ago).

@MartinBucko

This comment has been minimized.

MartinBucko commented Jan 6, 2017

Thanks for answer. I try to run meteor production mode and i also play with different versions of meteor without success. Also i try to revert packages versions to last production working build and it don't helps. Its really weird. I'm sad i don't can push ma code to production...

Here is my packages if it help some

@Akryum

This comment has been minimized.

Akryum commented Jan 11, 2017

Here is a full error log with the latest packages and small changes made to the package (removed '.css' extension, didn't help).

C:\Users\Akryum\AppData\Local\.meteor\packages\static-html\1.1.13\plugin.compileStaticHtmlBatch.os\npm\node_modules\meteor\promise\node_modules\meteor-promise\promise_server.js:177
      throw error;
      ^

Error: Attempting to combine different files:
{ refreshable: true,
  sourcePath: 'client/ui/MyButton.vue',
  targetPath: 'client/ui/MyButton.vue',
  servePath: '/client/ui/MyButton.vue',
  hash: '1cf943f86183eba7ca3491c2670b178a40c3dc9c',
  lazy: true,
  type: 'js',
  data: <Buffer 2f 2f 20 54 68 65 73 65 20 73 74 79 6c 65 73 20 68 61 76 65 20 61 6c 72 65 61 64 79 20 62 65 65 6e 20 61 70 70 6c 69 65 64 20 74 6f 20 74 68 65 20 64 ... >,
  emtpyStub: true,
  imported: false,
  installPath: 'client/ui/MyButton.vue' }
{ type: 'js',
  data: <Buffer 76 61 72 20 5f 5f 76 75 65 5f 73 63 72 69 70 74 5f 5f 2c 20 5f 5f 76 75 65 5f 74 65 6d 70 6c 61 74 65 5f 5f 3b 5f 5f 76 75 65 5f 73 63 72 69 70 74 5f ... >,
  sourcePath: 'client/ui/MyButton.vue',
  targetPath: 'client/ui/MyButton.vue',
  servePath: '/client/ui/MyButton.vue',
  hash: '1ce08740ecc69a68045f3e5055bec1d70ef539b0',
  sourceMap:
   { version: 3,
     sources: [ 'client/ui/MyButton.vue' ],
     names: [ 'props', 'methods', 'handleClick', '$emit' ],
     mappings: 'AAOA,OAAA;AACA,SAAA,CAAA,OAAA,CADA;AAEA,WAAA;AACA,eADA,yBACA;AACA,WAAA,KAAA,CAAA,OAAA,EAAA,IAAA;AACA;AAHA;AAFA,CAAA',
     file: 'client/ui/MyButton.vue',
     sourcesContent: [ '<template>\r\n<div class="button" @click="handleClick">\r\n  <span class="label">{{label}}</span>\r\n</div>\r\n</template>\r\n\r\n<script>\r\nexport default {\r\n  props: [\'label\'],\r\n  methods: {\r\n    handleClick() {\r\n      this.$emit(\'click\', this);\r\n    }\r\n  }\r\n}\r\n</script>\r\n\r\n<style scoped>\r\n.button {\r\n  display: inline-block;\r\n  background-color: #40b883;\r\n  padding: 12px;\r\n  border-radius: 3px;\r\n  color: white;\r\n  cursor: pointer;\r\n  transition: background-color 0.1s;\r\n  -webkit-touch-callout: none; /* iOS Safari */\r\n  -webkit-user-select: none;   /* Chrome/Safari/Opera */\r\n  -khtml-user-select: none;    /* Konqueror */\r\n  -moz-user-select: none;      /* Firefox */\r\n  -ms-user-select: none;       /* Internet Explorer/Edge */\r\n  user-select: none;\r\n}\r\n\r\n.button:hover {\r\n  background-color: #a0ddc4;\r\n}\r\n</style>\r\n' ] },
  lazy: false,
  bare: false,
  mainModule: false,
  imported: true,
  installPath: 'client/ui/MyButton.vue' }

    at checkProperty (C:\tools\isobuild\import-scanner.js:299:15)
    at ImportScanner._combineFiles (C:\tools\isobuild\import-scanner.js:309:5)
    at C:\tools\isobuild\import-scanner.js:212:14
    at Array.forEach (native)
    at ImportScanner.addInputFiles (C:\tools\isobuild\import-scanner.js:183:11)
    at C:\tools\isobuild\compiler-plugin.js:1037:15
    at Array.forEach (native)
    at Function.computeJsOutputFilesMap (C:\tools\isobuild\compiler-plugin.js:1008:19)
    at ClientTarget._emitResources (C:\tools\isobuild\bundler.js:1020:8)
    at C:\tools\isobuild\bundler.js:791:12
    at C:\tools\utils\buildmessage.js:359:18
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at C:\tools\utils\buildmessage.js:352:34
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at C:\tools\utils\buildmessage.js:350:23
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at Object.enterJob (C:\tools\utils\buildmessage.js:324:26)
    at ClientTarget.make (C:\tools\isobuild\bundler.js:782:18)
    at C:\tools\isobuild\bundler.js:2652:14
    at C:\tools\isobuild\bundler.js:2741:20
    at Array.forEach (native)
    at Function._.each._.forEach (C:\Users\Akryum\AppData\Local\.meteor\packages\meteor-tool\1.4.2_3\mt-os.windows.x86_32\dev_bundle\lib\node_modules\underscore\underscore.js:79:11)
    at C:\tools\isobuild\bundler.js:2740:7
    at C:\tools\utils\buildmessage.js:271:13
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at C:\tools\utils\buildmessage.js:264:29
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at C:\tools\utils\buildmessage.js:262:18
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at C:\tools\utils\buildmessage.js:253:23
    at [object Object].withValue (C:\tools\utils\fiber-helpers.js:89:14)
    at Object.capture (C:\tools\utils\buildmessage.js:252:19)
    at bundle (C:\tools\isobuild\bundler.js:2633:31)
    at C:\tools\isobuild\bundler.js:2580:32
    at Object.withCache (C:\tools\fs\files.js:1601:12)
    at Object.exports.bundle (C:\tools\isobuild\bundler.js:2580:16)
    at C:\tools\runners\run-app.js:574:36
    at Function.run (C:\tools\tool-env\profile.js:490:12)
    at bundleApp (C:\tools\runners\run-app.js:573:34)
    at AppRunner._runOnce (C:\tools\runners\run-app.js:617:35)
    at AppRunner._fiber (C:\tools\runners\run-app.js:876:28)
    at C:\tools\runners\run-app.js:403:12
@Akryum

This comment has been minimized.

Akryum commented Jan 11, 2017

If I put the addJavaScript in lazy mode, the production mode build succeed but all the .vue files outside of imports are missing. For example, a client/ui/UiButton.vue should be automatically included and registered as <ui-button>.

@Akryum

This comment has been minimized.

Akryum commented Feb 1, 2017

@benjamn Any idea how to work around this?

@benjamn

This comment has been minimized.

Member

benjamn commented Feb 1, 2017

Ah, one of the two files (the first one) has emtpyStub: true, which is supposed to give preference to the other file (instead of trying to combine them). However, if you look closely, that property name is misspelled, so the emptyStub: true logic was never working properly.

This is a bug I noticed and hopefully fixed with 4fb2625. I'll cherry-pick that commit into the 1.4.2.4 release (a small release, coming very soon).

cc @abernix

@Akryum

This comment has been minimized.

Akryum commented Feb 1, 2017

@benjamn Thanks for the quick reply! Will this make .vue able to add both JavaScript and Style on the same inputFile?

@benjamn benjamn modified the milestones: Release 1.4.2.x, Release 1.4.3 Feb 1, 2017

@benjamn

This comment has been minimized.

Member

benjamn commented Feb 1, 2017

@Akryum Can you try this again after running meteor update --release 1.4.2.4-rc.1 in your app?

@Akryum

This comment has been minimized.

Akryum commented Feb 2, 2017

@benjamn It's working great! No more errors with meteor --production

@benjamn benjamn closed this Feb 2, 2017

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment