Вам может понадобиться соответствующий загрузчик для обработки этого типа файлов. <BrowserRouter> - PullRequest
0 голосов
/ 16 января 2019

Я работаю в Webpack с реагировать и получаю сообщение об ошибке типа «Возможно, вам нужен соответствующий загрузчик для обработки этого типа файлов».и указатель на который находится в файле index.js.Я сделал всю конфигурацию с разных сайтов.Я провел много исследований и не нашел никакого решения. Вот мое

Это то, что я получаю после запуска npm run build.Хеш: 6e44e1d4943de3ad0fbc Версия: webpack 4.19.1 Время: 159 мс Время постройки: 16.01.2009 17:10:14 1 ресурс Entrypoint main = main.js [0] ./src/index.js 231 байт {0} [встроенный] [сбой] [1 ошибка]

ERROR in ./src/index.js 20:2
Module parse failed: Unexpected token (20:2)
You may need an appropriate loader to handle this file type.
|
| ReactDOM.render(
>   <BrowserRouter>
|     <Switch>
|       {/* redirection path */}

код файла webpack.config.js:

const HTMLWebPackPlugin = require("html-webpack-plugin");
            const path = require("path");   
            module.export = {
              entry: "src/index.js",
              output: {
                path: path.resolve(__dirname, "dist"),
                filename: "gem-webpack.bundle.js"
              },

              module: {
                rules: [
                  {
                    test: /\.(js|jsx)$/,
                    exclude: /node_modules/,
                    // include: __dirname + "/app/",
                    loader: "babel-loader",
                    query: {
                      presets: [
                        "@babel/preset-env",
                        "@babel/preset-react",
                        "es2015 ",
                        "stage-0",
                        "transpile jsx"
                      ]
                    }
                  },
                  {
                    test: /\.(.css)$/,
                    use: [
                      { loader: "style-loader" },
                      {
                        loader: "css-loader",
                        options: {
                          modules: true
                        }
                      },
                      {
                        loader: "sass-loader"
                      }
                    ]
                  },
                  {
                    test: /\.(.html)$/,
                    use: [
                      {
                        loader: "html-loader"
                      }
                    ]
                  },
                  {
                    test: /\.(jpe?g|png|gif|svg|ico)$/i,
                    use: [
                      {
                        loader: "file-loader",
                        options: {
                          outputPath: "assets/"
                        }
                      }
                    ]
                  }
                ]
              },

              plugin: [
                new HTMLWebPackPlugin({
                  template: "public/index.html",
                  filename: "./index.html"
                })
              ]
            };


    This is my .babelrc :

    {
      "presets": [
        "@babel/preset-env",
        "@babel/preset-react",
        "es2015",
        "transpile jsx",
        "stage-0"
      ]
    }

код .npmrc:

 save-exact=true

Пакетфайл .json:

{
  "name": "gemplex_ui",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "babel-preset-es2015": "6.24.1",
    "bootstrap": "^4.2.1",
    "hamburgers": "^1.1.3",
    "jquery": "^3.3.1",
    "jquery.js": "0.0.2-security",
    "popper.js": "^1.14.6",
    "react": "^16.7.0",
    "react-dom": "^16.7.0",
    "react-fa": "^5.0.0",
    "react-owl-carousel2": "^0.3.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.2",
    "video.js": "^7.4.1",
    "videojs-playlist": "^4.2.6"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "webpack --mode production",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "webpbuild": "webpack --mode production"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "devDependencies": {
    "@babel/core": "7.2.2",
    "@babel/preset-env": "7.2.3",
    "@babel/preset-react": "^7.0.0",
    "babel-loader": "8.0.5",
    "css-loader": "^2.1.0",
    "html-loader": "^0.5.5",
    "html-webpack-plugin": "^3.2.0",
    "react-alice-carousel": "^1.13.0",
    "webpack": "4.19.1",
    "webpack-cli": "3.2.1",
    "webpack-dev-server": "3.1.14"
  }
}

спасибо.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...