Meteor-files: Error after upgrading to 1.9.6 "onAfterRemove" is read-only

[mgscreativa]

Hi! After upgrade to Meteor 1.6, I upgraded all packages (meteor and npm) but it seems that something got wrong with ostrio:files. The files collection was working just fine, this started after upgrade.

ostrio:[email protected]
[email protected]
Server Issue

Error log:

=> Errors prevented startup:

While building for web.browser:
imports/api/Images/Images.js:1:94: imports/api/Images/Images.js:
"onAfterRemove" is read-only

While building for os.linux.x86_64:
imports/api/Images/Images.js:1:94: imports/api/Images/Images.js:
"onAfterRemove" is read-only

=> Your application has errors. Waiting for file change.

Files Collection Class:

import { Meteor } from 'meteor/meteor';
import { FilesCollection } from 'meteor/ostrio:files';

const Images = new FilesCollection({
  debug: true,
  throttle: false,
  storagePath: () => `${Meteor.absolutePath}/uploads`,
  downloadRoute: '/uploads',
  collectionName: 'Images',
  allowClientCode: false,
  onbeforeunloadMessage() {
    return 'Upload is still in progress! Upload will be aborted if you leave this page!';
  },
...
...
...
  onAfterRemove(cursor) {
    import { onAfterRemove } from '../../modules/server/upload-files';

    onAfterRemove(cursor);
  },
...
...
...
});

export default Images;

[mgscreativa]

Sorry, it seems that is related to babel...

[mksh-su]

Hello @mgscreativa ,

What was the version of meteor-files that you used?
Please, let us and other users know what was the problem and how you solved it. Thanks in advance!

[mgscreativa]

Hi @mksh-su! Sorry for that I thought that the issue was related to babel so decided to close it for further investigation.

Back in time, I have developed this model to be able to upload files with this component, for some reason I've forgotten I needed to call import inside the component hooks and that was just fine, mi implementation worked just fine.

After upgrading to lastest ostro:files 1.9.6 and meteor 1.6.0.1 it started to throw the error and refused to compile.

To be able to compile I needed to call imports at the beginning of the file as usual. It still didn't tested yet, because , as I said before, for some reason that didn't worked.

Tomorrow will try to test it out to see what's happening.

Bye!

[dr-dimitru]

Hello @mgscreativa ,

You're right this issue is coming from Babel, and won't be fixed. Read more on this here:

... the structure of ES6 modules is static, you can’t conditionally import or export things. That brings a variety of benefits.

This restriction is enforced syntactically by only allowing imports and exports at the top level...

I suggest to use require() as it can be conditional.
I believe we can close this one.

[mgscreativa]

Hi! @dr-dimitru ! Having my code like this got the meteor server working, still I can't test it out, because the upgrade broke my React template code, so I have to get it on his feet again, after testing will try to post results here!

Code now looks like this:

/* eslint-disable global-require */ // Stop annoying me eslint!

import { Meteor } from 'meteor/meteor';
import { FilesCollection } from 'meteor/ostrio:files';

const Images = new FilesCollection({
  debug: true,
  throttle: false,
  storagePath: () => `${Meteor.absolutePath}/uploads`,
  downloadRoute: '/uploads',
  collectionName: 'Images',
  allowClientCode: false,
  onbeforeunloadMessage() {
    return 'Upload is still in progress! Upload will be aborted if you leave this page!';
  },
...
...
...
  onAfterRemove(cursor) {
    const { onAfterRemove } = require('../../modules/server/upload-files');

    onAfterRemove(cursor);
  },
...
...
...
});

export default Images;

[mgscreativa]

Hi! I can now confirm (after fixing a great mess-up with my app template, jeje) that the use of require works as expected.

I remembered that I needed to have this on each function hook in order to be able to hide hook code to client side of app...

[dr-dimitru]

@mgscreativa you can use exact code splitting, as in our demo app:

• Client: https://github.com/VeliovGroup/Meteor-Files-Demos/blob/master/demo/imports/client/files.collection.js
• Server: https://github.com/VeliovGroup/Meteor-Files-Demos/blob/master/demo/imports/server/files.collection.js

[mgscreativa]

Thanks @dr-dimitru !

I got it woring by splitting code like the demo you mentioned!

thanks!

[dr-dimitru]

@mgscreativa awesome, I'm glad it's working for you 😄
IMHO exact code splitting much better, than conditional require or import statements.