Блог

Главная - Вопросы по программированию - Я получаю эту ошибку «отсутствует index.htm файл при попытке использовать этот codesandbox локально

Я получаю эту ошибку «отсутствует index.htm файл при попытке использовать этот codesandbox локально

#reactjs #webpack

#reactjs ( реакция ) #webpack #reactjs

Вопрос:

Просто простой вопрос новичка, изучающего Reactjs, и хотел заставить этот Webpack Starter Kit работать, поскольку он работает в изолированной среде.

При использовании того же кода в Visual Studio Code я получаю эту ошибку и хотел бы получить помощь, как это исправить

Я пробовал много вещей в течение нескольких часов, таких как:

Я попытался добавить app папку и шаблон index.html
Я попытался изменить путь запуска devServer
Я попробовал параметры HtmlWebpackPlugin
Я попробовал моделирование с index.html
Я попытался задать HtmlWebpackPlugin путь к шаблону «src/app/index.html «

     ERROR in   Error: Child compilation failed:
      Entry module not found: Error: Can't resolve 'L:tempwebpack-4appindex.html' in 'L:tempwebpack-4':
      Error: Can't resolve 'L:tempwebpack-4appindex.html' in 'L:tempwebpack-4'
    
      - compiler.js:79
        [webpack-4]/[html-webpack-plugin]/lib/compiler.js:79:16
    
      - Compiler.js:306
        [webpack-4]/[webpack]/lib/Compiler.js:306:11
    
      - Compiler.js:630
        [webpack-4]/[webpack]/lib/Compiler.js:630:14
    
    
      - Hook.js:154 AsyncSeriesHook.lazyCompileHook
        [webpack-4]/[tapable]/lib/Hook.js:154:20
    
      - Compiler.js:627
        [webpack-4]/[webpack]/lib/Compiler.js:627:30
    
    
      - Hook.js:154 AsyncSeriesHook.lazyCompileHook
        [webpack-4]/[tapable]/lib/Hook.js:154:20
    
      - Compilation.js:1325
        [webpack-4]/[webpack]/lib/Compilation.js:1325:35

Child html-webpack-plugin for "index.html":

    ERROR in Entry module not found: Error: Can't resolve 'L:tempwebpack-4appindex.html' in 'L:tempwebpack-4'

Комментарии:

1. У вас такая же ошибка после добавления /app/index.html файла? Вы можете попробовать добавить вызов path.resolve в строку шаблона для html-плагина, например template: path.resolve(__dirname, "/app/index.html"')

2. У вас есть index.html и app папка внутри src папки. Но это должна быть папка верхнего уровня, рядом с src . Или измените путь внутри webpack.config на /src/app/index.html . Попробуйте оба с path.resolve и без (старый способ, как у вас было раньше)

3. Нет, рядом с src. Еще на один уровень выше. Вне src. Переместите его сюда или измените path на /src/app/index.html . На самом деле вы можете переместить его куда хотите, просто убедитесь, что path соответствует фактическому расположению файла. Прямо сейчас webpack ищет /app/index.html , но у вас его нет, у вас есть только /src/app/index.html .

4. Я думаю, это просто не очень хороший шаблон. Это работает в codesandbox, потому что codesandbox фактически использует Parcel для компиляции, а не webpack. Если вы хотите изучить React, я бы посоветовал пользователю создать приложение React github.com/facebook/create-react-app

5. На самом деле вам не нужна косая черта в начале, это была опечатка с моей стороны. src/app/index.html это правильный путь. CRA уже использует webpack, вы можете попробовать eject , если хотите