I am new to Reactjs and am started learning it. I have been trying to start a basic hello world program but its failing at compilation level.
Created a start up hello-word program with create-react-app hello-world it gave me a nice folder structure with bunch of files.
And Here you can see the compilation error

Failed to compile

./src/index.js

Module build failed: Error: Failed to load plugin import: Cannot find module 

'eslint-plugin-import'

Referenced from: 

at Array.forEach (native)

at Array.reduceRight (native)

This error occurred during the build time and cannot be dismissed.

Here the error states cannot find module so i tried to install eslint plugin import ,standard ..etc but still its not worked.
Below is my webpack.config.dev.js

// @remove-on-eject-begin

/**

* Copyright (c) 2015-present, Facebook, Inc.

*

* This source code is licensed under the MIT license found in the

* LICENSE file in the root directory of this source tree.

 */

// @remove-on-eject-end

'use strict';



 const autoprefixer = require('autoprefixer');

   const path = require('path');

  const webpack = require('webpack');

  const HtmlWebpackPlugin = require('html-webpack-plugin');

  const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-

  plugin');

  const InterpolateHtmlPlugin = require('react-dev-

  utils/InterpolateHtmlPlugin');

  const WatchMissingNodeModulesPlugin = require('react-dev-

  utils/WatchMissingNodeModulesPlugin');

  const eslintFormatter = require('react-dev-utils/eslintFormatter');

  const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin');

  const getClientEnvironment = require('./env');

  const paths = require('./paths');





 const env = getClientEnvironment(publicUrl);



  module.exports = {

  // You may want 'eval' instead if you prefer to see the compiled output in 

 DevTools.

   // See the discussion in https://github.com/facebookincubator/create-

  react-app/issues/343.

  devtool: 'cheap-module-source-map',



 entry: [

// We ship a few polyfills by default:

require.resolve('./polyfills'),

// Include an alternative client for WebpackDevServer. A client's job is to

// connect to WebpackDevServer by a socket and get notified about changes.

// When you save a file, the client will either apply hot updates (in case

// of CSS changes), or refresh the page (in case of JS changes). When you

// make a syntax error, this client will display a syntax error overlay.

// Note: instead of the default WebpackDevServer client, we use a custom one

// to bring better experience for Create React App users. You can replace

// the line below with these two lines if you prefer the stock client:

// require.resolve('webpack-dev-server/client') + '?/',

// require.resolve('webpack/hot/dev-server'),

require.resolve('react-dev-utils/webpackHotDevClient'),

// Finally, this is your app's code:

paths.appIndexJs,

// We include the app code last so that if there is a runtime error during

// initialization, it doesn't blow up the WebpackDevServer client, and

// changing JS code would still trigger a refresh.

 ],

 output: {

// Next line is not used in dev but WebpackDevServer crashes without it:

path: paths.appBuild,

// Add /* filename */ comments to generated require()s in the output.

pathinfo: true,

// This does not produce a real file. It's just the virtual path that is

// served by WebpackDevServer in development. This is the JS bundle

// containing code from all our entry points, and the Webpack runtime.

filename: 'static/js/bundle.js',

// There are also additional JS chunk files if you use code splitting.

chunkFilename: 'static/js/[name].chunk.js',

// This is the URL that app is served from. We use / in development.

publicPath: publicPath,

// Point sourcemap entries to original disk location (format as URL on 

Windows)

devtoolModuleFilenameTemplate: info =>

  path.resolve(info.absoluteResourcePath).replace(/\/g, '/'),

 },

 resolve: {



 modules: ['node_modules', paths.appNodeModules].concat(

  // It is guaranteed to exist because we tweak it in `env.js`

  process.env.NODE_PATH.split(path.delimiter).filter(Boolean)

  ),



  extensions: ['.web.js', '.js', '.json', '.web.jsx', '.jsx'],

  alias: {

  // @remove-on-eject-begin

  // Resolve Babel runtime relative to react-scripts.

  // It usually still works on npm 3 without this but it would be

  // unfortunate to rely on, as react-scripts could be symlinked,

  // and thus babel-runtime might not be resolvable from the source.

  'babel-runtime': path.dirname(

    require.resolve('babel-runtime/package.json')

  ),

  // @remove-on-eject-end

  // Support React Native Web

  // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-

  with-react-native-for-web/

  'react-native': 'react-native-web',

   },

    plugins: [

  // Prevents users from importing files from outside of src/ (or 

   node_modules/).



   new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]),

   ],

  },

  module: {

  strictExportPresence: true,

   rules: [

  // TODO: Disable require.ensure as it's not a standard language feature.

  // We are waiting for https://github.com/facebookincubator/create-react-

  app/issues/2176.

  // { parser: { requireEnsure: false } },



  // First, run the linter.

  // It's important to do this before Babel processes the JS.

  {

    test: /.(js|jsx)$/,

    enforce: 'pre',

    use: [

      {

        options: {

          formatter: eslintFormatter,

          eslintPath: require.resolve('eslint'),

          // @remove-on-eject-begin

          baseConfig: {

            extends: [require.resolve('eslint-config-react-app')],

          },

          ignore: false,

          useEslintrc: false,

          // @remove-on-eject-end

        },

        loader: require.resolve('eslint-loader'),

      },

      ],

    include: paths.appSrc,

    },

   {

    // oneOf will traverse all following loaders until one will

    // match the requirements. When no loader matches it will fall

    // back to the file loader at the end of the loader list.

    oneOf: [





      {

        test: [/.bmp$/, /.gif$/, /.jpe?g$/, /.png$/],

        loader: require.resolve('url-loader'),

        options: {

          limit: 10000,

          name: 'static/media/[name].[hash:8].[ext]',

        },

      },

      // Process JS with Babel.

      {

        test: /.(js|jsx)$/,

        include: paths.appSrc,

        loader: require.resolve('babel-loader'),

        options: {

          // @remove-on-eject-begin

          babelrc: false,

          presets: [require.resolve('babel-preset-react-app')],



          cacheDirectory: true,

        },

      },

      // postcss loader applies autoprefixer to our CSS.

      // css loader resolves paths in CSS and adds assets as dependencies.

      // style loader turns CSS into JS modules that inject <style> tags.

      // In production, we use a plugin to extract that CSS to a file, but

      // in development style loader enables hot editing of CSS.

      {

        test: /.css$/,

        use: [

          require.resolve('style-loader'),

          {

            loader: require.resolve('css-loader'),

            options: {

              importLoaders: 1,

            },

          },

          {

            loader: require.resolve('postcss-loader'),

            options: {

              // Necessary for external CSS imports to work



              ident: 'postcss',

              plugins: () => [

                require('postcss-flexbugs-fixes'),

                autoprefixer({

                  browsers: [

                    '>1%',

                    'last 4 versions',

                    'Firefox ESR',

                    'not ie < 9', // React doesn't support IE8 anyway

                  ],

                  flexbox: 'no-2009',

                }),

              ],

            },

          },

        ],

      },



      {

        // Exclude `js` files to keep css loader working as it injects

        // it's runtime that would otherwise processed through file 

      loader.

        // Also exclude `html` and `json` extensions so they get processed

        // by webpacks internal loaders.

        exclude: [/.js$/, /.html$/, /.json$/],

        loader: require.resolve('file-loader'),

        options: {

          name: 'static/media/[name].[hash:8].[ext]',

        },

        },

       ],

     },



     ],

   },

    plugins: [



   new InterpolateHtmlPlugin(env.raw),

    // Generates an `index.html` file with the <script> injected.

   new HtmlWebpackPlugin({

     inject: true,

     template: paths.appHtml,

      }),



    new webpack.NamedModulesPlugin(),



   new webpack.DefinePlugin(env.stringified),



   new webpack.HotModuleReplacementPlugin(),



    new CaseSensitivePathsPlugin(),



   new WatchMissingNodeModulesPlugin(paths.appNodeModules),



    new webpack.IgnorePlugin(/^./locale$/, /moment$/),

   ],



  node: {

dgram: 'empty',

fs: 'empty',

net: 'empty',

tls: 'empty',

child_process: 'empty',

 },



  performance: {

    hints: false,

 },

 };

Can any one guide me how to come out of this build error.