Skip to content
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

Unexpected export #356

Closed
holgersielaff opened this issue Mar 19, 2018 · 13 comments
Closed

Unexpected export #356

holgersielaff opened this issue Mar 19, 2018 · 13 comments

Comments

@holgersielaff
Copy link

'Unexpected export' error at line 114 (npm 5.6.0)

Maybe export Spinner directly with 'export const'

@theodorejb
Copy link
Collaborator

What's giving you that error? Are you trying to load the file in a browser that doesn't support ES6 modules? You'll need to use a module bundler such as Webpack or Rollup for this to work.

@vikyd
Copy link

vikyd commented Mar 26, 2018

But how can I use spin.js V3 without Webpack or Rollup?

@thehig
Copy link

thehig commented Apr 4, 2018

I'm having this same issue, (unexpected token export) although not with webpack which is working fine, but within my jest tests (scaffolded through create-react-app)

image

Sample repo that demonstrates the problem: https://github.com/thehig/spinjs-unexpectedtokenimport

Edit: My guess is something's not being babelified

Edit: The 'jest' way to get the tooling to process modules is to use transformIgnorePatterns as outlined below, however this doesn't work in Create-React-App (facebook/create-react-app#2537) without ejecting. (Obviously not your problem, but a pain in the ass nonetheless)

package.json

{
  ....
  "jest": {
    "transformIgnorePatterns": ["/node_modules/(?!(spin.js\\.js$))"]
  }
}

@thehig thehig mentioned this issue Apr 4, 2018
@tolu
Copy link

tolu commented May 25, 2018

I'm having the same issue in my tests, using mocha with typescript (actually ts-node). The same issue will continue to be around (in node and ts-node) since even experimental module support requires the use of *.mjs file extensions at this time.

After some time spent reading up on the issue and the solutions it seems to me that it is premature to publish esnext/mjs/esm only...

This is from Rollup's readme
image

That (adding a module-field to package.json) seems like a solution that would work for the issues reported here as well as the original case #341.

I'll try to get a PR going along those lines in the weekend.

@theodorejb
Copy link
Collaborator

@tolu More and more libraries are moving to ES6, though, and at some point your tests will have to work with these files. The way I currently work around the lack of Node/IE support is to use ES6 imports in my tests, and then create a test bundle file with Rollup before running it with Mocha.

@thehig
Copy link

thehig commented May 27, 2018

This seems like an effective strategy to alienate users

@tolu
Copy link

tolu commented May 30, 2018

@theodorejb one important fact here is that when ES6 modules can be understood by Node without the --experimental-modules flag, even the solution implemented here in spin.js wont work as the files referenced are not postfixed with *.mjs.

A relatively simple solution seems to be to publish something that everyone can consume, and that includes everyone who has opted in for ES6.

But if you are not interested in a PR, I wont bother and keep using v2.3.2 that "just works" 😉

Comprehensive article on the subject:
https://medium.com/@kelin2025/so-you-wanna-use-es6-modules-714f48b3a953

@adonespitogo
Copy link

A browser-only library that needs nodejs package mechanism to in order to work. Great.

@tolu
Copy link

tolu commented Jun 19, 2018

An updated recommendation now that modules are supported in all major browsers:

From: https://developers.google.com/web/fundamentals/primers/modules

A note on file extensions
You may have noticed we’re using the .mjs file extension for modules. On the Web, the file extension doesn’t really matter, as long as the file is served with the JavaScript MIME type text/javascript. The browser knows it’s a module because of the type attribute on the script element.

Still, we recommend using the .mjs extension for modules, for two reasons:

  1. During development, it makes it crystal clear that the file is a module as opposed to a regular script. (It’s not always possible to tell just by looking at the code.) As mentioned before, modules are treated differently than regular scripts, so the difference is hugely important!
  2. It’s consistent with Node.js, where the experimental modules implementation only supports files with the .mjs extension.

@ghost
Copy link

ghost commented Oct 26, 2018

#364 (comment)

@kgeographer
Copy link

kgeographer commented Sep 15, 2019

I am trying to use this in a Django app, with no ES6 or webpack. I cannot simply load spin.js the same way I load a dozen other packages, as the export command is invalid. The website statement "No dependencies" is not true, and IMHO should be changed to reflect that.

@theodorejb
Copy link
Collaborator

@kgeographer Did you read the website instructions? The Bundling paragraph says the following:

If for some reason you can't use ES6 modules or a module bundler, download spin.umd.js and save it in your repo.

@kgeographer
Copy link

kgeographer commented Sep 15, 2019

I am ashamed to say I did not. For ES5, I needed the full reference var spinner = new Spin.Spinner().spin(); to get started, but otherwise good to go. Sorry for the bother.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants