I am creating springboot + react application with webpack and babel some of the atlaskit packages are not supporting and it shows error

Jira Development Jira Cloud
1

i am using atlaskit packages in that Navigation next => Sortable items i am getting the following error , it shows like syntax error.

ERROR in ./components/setup/Administrator/Admin.js
Module build failed (from C:/Users/manju/Projects/Task/plugin-for-jira/node_modules/babel-loader/lib/index.js):
SyntaxError: C:\Users\manju\Projects\Task\plugin-for-jira\src\main\resources\javascript\components\setupservicemgt\Administrator\Admin.js: Unexpected token (14:12)

13 | import React,

{ Component }

from ‘react’;

14 | import type

{ DropResult }

from ‘react-beautiful-dnd’;

^
15 import { colors }

from ‘@atlaskit/theme’;
16

17 | import

{ SortableItem, SortableGroup, SortableContext }

from ‘@atlaskit/navigation-next’;
at Object.raise (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:6325:17)
at Object.unexpected (C:\Users\manju\Projects\ITSMTask\plugin-for-jira\node_modules@babel\parser\lib\index.js:7642:16)
at Object.expectContextual (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:7608:41)
at Object.parseImport (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:11168:12)
at Object.parseStatementContent (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:9927:27)
at Object.parseStatement (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:9829:17)
at Object.parseBlockOrModuleBlockBody (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:10405:25)
at Object.parseBlockBody (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:10392:10)
at Object.parseTopLevel (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:9758:10)
at Object.parse (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:11270:17)
at parse (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\parser\lib\index.js:11306:38)
at parser (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\core\lib\transformation\normalize-file.js:170:34)
at normalizeFile (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\core\lib\transformation\normalize-file.js:138:11)
at runSync (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\core\lib\transformation\index.js:44:43)
at runAsync (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\core\lib\transformation\index.js:35:14)
at process.nextTick (C:\Users\manju\Projects\Task\plugin-for-jira\node_modules@babel\core\lib\transform.js:34:34)
at process._tickCallback (internal/process/next_tick.js:61:11)
@ ./setup.js 25:0-69 36:31-36
@ multi ./setup.js
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! spring-boot-jake-test@1.0.0 build: webpack -d
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the spring-boot-jake-test@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

.babelrc

{
“presets”: [
“@babel/preset-env”,
“@babel/preset-react”
],
“plugins”: [
“@babel/plugin-proposal-class-properties”,
]
}

Would anyone like to give me some helps?

Any helps would be appreciated!

Thanks.

2

Hi @MANJUPREM,

The problem seems to be in your Admin.js file. “import type” is Flow syntax. If you are using Flow, you need to add the Flow preset to your babelrc.
If you are using plain JavaScript, you cannot import or use types.

3

@mventnor Thank you . Its working fine .
i am using ReactJS.