DEV Community

adamhercull
adamhercull

Posted on

SyntaxError: import declarations may only appear at top level of a module

Hi guys, Im working on a tutorial project to skll my way up in ReactJS. Im stuck with an error related to webpack and babel that says

"SyntaxError: import declarations may only appear at top level of a module"

Here's my package.json file:

{
"name": "reactjs-basics",
"version": "1.0.0",
"description": "Some basic ReactJS",
"main": "index.js",
"scripts": {
"start": "npm run build",
"build": "webpack -d && copyfiles src/index.html dist/index.html && webpack-dev-server --content-base src/ --inline --hot --history-api-fallback",
"build:prod": "webpack -p && copyfiles src/index.html dist/index.html"
},
"keywords": [
"reactjs"
],
"author": "Adam",
"license": "MIT",
"dependencies": {
"babel-core": "^6.26.3",
"react": "^16.8.6",
"react-dom": "^16.8.6",
"react-redux": "^6.0.1",
"redux": "^4.0.1",
"redux-logger": "^3.0.6"
},
"devDependencies": {
"babel-loader": "^6.2.4",
"babel-preset-es2015": "^6.9.0",
"babel-preset-react": "^6.11.1",
"babel-preset-stage-2": "^6.11.0",
"webpack": "^1.15.0",
"webpack-dev-server": "^1.16.5"
}
}

[webpack] [babel] [config]

Any help ?

Top comments (3)

Collapse
 
rhymes profile image
rhymes

Can you show your .babelrc?

Collapse
 
laurieontech profile image
Laurie

That error looks like it might be talking about an import statement in one of your javascript files? What pointed you towards babel/webpack as the error source?

Collapse
 
andy profile image
Andy Zhao (he/him)

It'd be great if you could push up your code to GitHub or some public repo for us to check out. :)