Как я решил ошибку webpack/chokidar — Ошибка: EBUSY: ресурс занят или заблокирован, lstat ‘C:\DumpStack.log

Как я решил ошибку webpack/chokidar — Ошибка: EBUSY: ресурс занят или заблокирован, lstat ‘C:\DumpStack.log.tmp’
… (‹project_root›\node_modules\chokidar\index.js:647:10)

После долгих поисков, от переполнения стека до проблем с github, я наконец решил эту проблему в своем проекте и решил написать об этом, чтобы помочь всем, кто может столкнуться с той же проблемой.

У меня возникла эта проблема при попытке запустить webpack-dev-server, проблема была в моем конфигурационном файле webpack, вот где я все ошибся. Вот как это выглядело:

const path = require('path');

module.exports = {
  mode: 'development',
  entry: './src/app.ts',
  output: {
    filename: 'app.js',
    path: path.resolve(__dirname, 'dist'),
    clean: true,
    publicPath: './',
  },
  devServer: {
    static: '/',
    compress: true,
    host: '0.0.0.0',
    port: 8080,
    devMiddleware: {
      index: true,
      mimeTypes: { phtml: 'text/html' },
      publicPath: './',
      serverSideRender: true,
      writeToDisk: true,
    },
  },
  // ...
}

Свойство devServer.static заставляет веб-пакет искать статические файлы по пути /, что делает chokidar (модуль, от которого зависит веб-пакет). Теперь вам может быть интересно, а что в этом плохого, ведь / — это корневой каталог моего проекта. Но / на самом деле относится к корневому каталогу моей системы, который в данном случае является каталогом C:, потому что я работаю в Windows. Затем chokidar пытается просмотреть файлы в каталоге C:, но это не удается, потому что у него нет для этого соответствующих прав доступа к файлам. Отсюда и ошибка Error: EBUSY: resource busy or locked, lstat ‘C:\DumpStack.log.tmp’

Что я сделал тогда?

Двигаясь дальше, я попытался сначала найти файл журнала C:\DumpStack.log.tmp, потому что думал, что смогу исправить это, повысив права доступа к файлу, но не смог. Затем я перезагрузил свой компьютер, тривиально, но иногда эффективно. Тем не менее, это не сработало, когда я открыл свой браузер и искал его. Я испробовал множество подходов из StackOverFlow, например: удаление каталога модулей узлов и очистку кеша npm с помощью npm cache clean перед повторным запуском npm install, но это не сработало, и даже удаление nodejs и его повторная установка. Затем я начал решать различные проблемы github, связанные с ошибкой, и, похоже, многие другие тоже сталкивались с ней из chokidar через другие пакеты или иногда с расширением кода. Наиболее важной из них была проблема с vscode-cmake-tools:

Именно это натолкнуло меня на идею, которую я использовал для ее решения. Я понял, что мне нужно указать абсолютный путь для свойства devServer.static, передав вместо него ./ . Вот исправленное — полный файл конфигурации веб-пакета:

const path = require('path');

module.exports = {
  mode: 'development',
  entry: './src/app.ts',
  output: {
    filename: 'app.js',
    path: path.resolve(__dirname, 'dist'),
    clean: true,
    publicPath: './',
  },
  devServer: {
    static: './',
    compress: true,
    host: '0.0.0.0',
    port: 8080,
    devMiddleware: {
      index: true,
      mimeTypes: { phtml: 'text/html' },
      publicPath: './',
      serverSideRender: true,
      writeToDisk: true,
    },
  },
  devtool: 'inline-source-map',
  module: {
    rules: [
      {
        test: /\.ts$/,
        use: 'ts-loader',
        exclude: /node_modules/,
      },
    ],
  },
  resolve: {
    extensions: ['.ts', '.js'],
  },
};

Спасибо за прочтение, это моя первая статья на Medium😑.