Webpack. Module parse failed: Unexpected token (1:0)

Question

Попытка сборки проекта на вебпаке 5.4.0 валится с такой ошибкой:

ERROR in ./src/index.html 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <!DOCTYPE html>
| <html lang="ru">
| <head>
 @ ./src/index.js 2:0-22

В dev-режиме ошибка та же, однако все стили, шрифты и скрипты подключаются без проблем. HMR работает. HTML-лоадеры не стоят, только html-webpack-plugin.

Конфиг вебпака:

const path = require('path');
const devMode = process.env.NODE_ENV !== 'production';
const  webpack  = require('webpack');
const  HtmlWebpackPlugin  = require('html-webpack-plugin');
const  MiniCssExtractPlugin  = require('mini-css-extract-plugin');
const  { CleanWebpackPlugin } = require('clean-webpack-plugin');

module.exports = {
  
  entry: './src/index.js',

  module: {
  
    rules: [
     
      { test: /\.(js)$/, use: 'babel-loader' },

      {
        test: /\.css$/,
        use: [
          "style-loader",
          "css-loader", 
        ],
      },
    
    {
      test: /\.(png|svg|ttf|woff|jpg|gif)$/,
      use: ["file-loader"]
    }
      
    ],
    
  },

  output: 
  { 
  path: path.resolve(__dirname, 'dist'),
  filename: '[name].[hash:8].js',
  sourceMapFilename: '[name].[hash:8].map',
  chunkFilename: '[id].[hash:8].js',
  publicPath: '/',
},

plugins: [

  new webpack.HotModuleReplacementPlugin(),
  new CleanWebpackPlugin(),
  new HtmlWebpackPlugin({
    title: 'webpack Boilerplate',
    template: path.resolve(__dirname, './src/index.html'),
    filename: 'index.html',
    inject: 'body'
  }),
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery'
  })
],

mode: 'development',
devServer: {
    historyApiFallback: true,
    contentBase: './src',
    open: true,
    compress: true,
    hot: true,
    port: 8008,
},
  
};

Не пойму, в чём дело. Пробовал запускать с html-лоадером, без html-webpack-plugin, одинаково. В чём может быть проблема?

Answer 1

Решение найдено! Ошибка была глупой и элементарной, в index.js зачем-то была строчка

import ('./index.html')

Скрипт пытался импортировать главную страницу в саму себя (м-да:). Вопрос закрыт.

Answer 2

у меня похожая ошибка была, в webpack.mix.js обязательно должно быть mix.js(....).vue() по каким то причинам .vue() не было

БЛОГ НА HUSL

Webpack. Module parse failed: Unexpected token (1:0)

Ответы (2 шт):