Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

SyntaxError: Unexpected token import on fresh project

See original GitHub issue

Version

3.0.0-beta.15

Reproduction link

http://take.ms/A60B9

Steps to reproduce

vue create vue-project
cd vue-project
jest tests/unit/HelloWorld.spec.js --no-cache

What is expected?

The test case is executed with no errors

What is actually happening?

Test suite failed to run

Adding the following block to babel.config.js fixes this particular error

env: {
    test: {
      presets: ['@babel/env'],
    },
  },

but it raises another error: http://take.ms/jlxuP

And this happens because import doesn’t work for some reason. When I change import HelloWorld from '@/components/HelloWorld.vue'; to const HelloWorld = require('../../src/components/HelloWorld.vue').default; it works fine: http://take.ms/ILHes

P.S. Unaliased import doesn’t work as well:

import HelloWorld from '../../src/components/HelloWorld.vue';

Issue Analytics

State:
Created 5 years ago
Reactions:1
Comments:18 (4 by maintainers)

Top GitHub Comments

1reaction

matrunchykcommented, Aug 14, 2018

Yes, it’s under ~/.npm

0reactions

JuanGrauGGGcommented, Nov 21, 2019

Version

3.0.0-beta.15

Reproduction link

http://take.ms/A60B9

Steps to reproduce

vue create vue-project

cd vue-project

jest tests/unit/HelloWorld.spec.js --no-cache

What is expected?

The test case is executed with no errors

What is actually happening?

Test suite failed to run

Adding the following block to babel.config.js fixes this particular error
env: {
    test: {
      presets: ['@babel/env'],
    },
  },
but it raises another error: http://take.ms/jlxuP

And this happens because import doesn’t work for some reason. When I change import HelloWorld from '@/components/HelloWorld.vue'; to const HelloWorld = require('../../src/components/HelloWorld.vue').default; it works fine: http://take.ms/ILHes

P.S. Unaliased import doesn’t work as well:
import HelloWorld from '../../src/components/HelloWorld.vue';

Typescript does not know how to handle vue files, therefore you need to place the following code in your index.d.ts fiile declare module '*.vue' { import Vue from 'vue'; export default Vue; }

Top Results From Across the Web

Node.js - SyntaxError: Unexpected token import - Stack Overflow

Node.js - SyntaxError: Unexpected token import · 4. Use transpiler like Babel to use import in Nodejs as it is not natively supported...

SyntaxError: Unexpected token 'export' in JavaScript

To solve the "Uncaught SyntaxError Unexpected token 'export'" error, ... Open your terminal in your project's root directory and run the following command....

syntaxerror unexpected token 'export' typescript - You.com

So the dependency in node_modules folder exports a function using ES6 import/export module. The code will throw error when it running in browser...

Unexpected Token Export: A Comprehensive Guide

– “Type” Property Set to “Module” in the package. · – Properly Import the Class Into Another File · – Use the Common....

How to fix SyntaxError: Unexpected token 'export' in JavaScript?

There is another reason why this error occurred when we try to work with ES6 modules. And that is we don't tell the...