1

The most recent version of aws-amplify was installed with npm. Additionally, npm init was run with the entrypoint file being 'entryPoint.js'. However, when I enter entryPoint.js and paste these lines of code at the top

import Amplify, {Auth} from 'aws-amplify';
import awsconfig from './aws-exports';
Amplify.configure(awsconfig);

I receive a JSLint error that reads:

Expected an identifier and instead saw 'import'.

How can I correctly import aws-amplify? I followed instructions off of https://docs.amplify.aws/lib/auth/getting-started/q/platform/js#option-1-use-pre-built-ui-components

joiep
  • 11
  • 1

1 Answers1

0

So JSLint is kinda new to the whole import game, and the instructions themselves say this about import:

JSLint recognizes a small but essential subset of the module syntax.

For a long time, JSLint didn't (iirc) support import at all, and then for a while maybe only with the es6 jslint directive, but that's by memory. I'm glad to see it supports as much as it does now.

And it looks like what that "small but essential subset" doesn't support is a default import on the same line as a named import.

But it does accept breaking that import into two lines like this:

import {Auth} from "aws-amplify";
import Amplify from "aws-amplify";
import awsconfig from "./aws-exports";
Amplify.configure(awsconfig);

// you didn't use Auth, so let's use it here in a 
// way that stops JSLint from complaining.
var myAuth = new Auth("something");
myAuth.something(1);

JSLint is real big on making code easy to scan and read. Maybe the thinking is that you don't want both types on the same line b/c maybe you'll read Amplify as a named import? I don't know exactly in this case.

But JSLint is a great tool to help ensure high quality JavaScript code. If you can get past its idiosyncrasies, like this one, it'll pay you back in the long term, though many will suggest for "modern" JavaScript code you should consider using eslint instead. It's a bit more configurable, which is itself a double-edged sword.

ruffin
  • 16,507
  • 9
  • 88
  • 138
  • Hi! Thank you for suggesting that. I split up the lines in my code and that issue seemed to resolve or for the least become non-fatal. One issue that I am now having is a failure to resolve module specifier; they seem to be wanting whatever is in the brackets to start with "/" or "./" or "../". That wasn't in the walkthrough so I am wary to change it, do you know what could be causing this? – joiep Dec 03 '20 at 18:31
  • @joiep That's probably a new question if the imports as written work with JSLint. What's the code? Who are "they"? ;^D Is JSLint complaining? I don't think it should; what I had above lints on jslint.com. Is it an [npm](https://docs.npmjs.com/cli/v6/commands/npm-install) issue? That is, how can you be sure the libraries are in context? Etc etc. But that's probably, unless it's a JSLint issue, a new question that needs a good [plunkr](https://plnkr.co/) to really diagnose. – ruffin Dec 03 '20 at 21:02