module-name
the module to import. This is usually the relative or absolute pathname of the .js file that contains the module, excluding the .js extension. Some packaging tools can allow or require the use of this extension; check your running environment. Only single and double quotation marks are allowed.
- import | MDN

import of nodejs is not exactly the same as import of ES6. After babeljs, it will be compiled to require

other files can be imported because webpack compiles js files when packaging, and using different loaders for different files is not supported by module itself.
webpack loader explanation tutorial: https://www.webpackjs.com/con...,

for example:
module: {

rules: [
  { 
    test: /\.js$/,
    use: {
      loader: 'babel-loader',
      options: {
        presets: ['@babel/preset-env']
      }
    } 
  },
  {
    test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: path.posix.join('lib', '/img/[name].[hash:7].[ext]')
    }
  },
  {
    test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: path.posix.join('lib', '/media/[name].[hash:7].[ext]')
    }
  }
]

}

you understand that the import import module used by ES6, all files are modules, a file represents a module, regardless of whether the contents of the file are pictures or other types of css, webpack will convert them into js, which can be recognized by the browser.