82962


<https://github.com/yuumi3/react_book/blob/master/docs/install_mac.md>
を参考に進めたところ、npm start でエラーが発生してしまいます。

[code]

    > hello_react@1.0.0 start
    > webpack serve
    
    [webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
     - options has an unknown property 'publicPath'. These properties are valid:
       object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, magicHtml?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, setupExitSignals?, static?, watchFiles?, webSocketServer? }
    
[/code]

環境は Ubuntu 20.04.3 LTS  
ディレクトリ構造は参考githubと同じです。

./webpack.congig.jsの中身はこんな感じ。

[code]

    module.exports = {
      entry: {
        app: "./src/index.js"
      },
      output: {
        path: __dirname + '/public/js',
        filename: "[name].js"
      },
        devServer: {
        contentBase: __dirname + '/public',
        port: 8080,
        publicPath: '/js/'
      },
      devtool: "eval-source-map",
      mode: 'development',
      module: {
        rules: [{
          test: /\.js$/,
          enforce: "pre",
          exclude: /node_modules/,
          loader: "eslint-loader"
        }, {
          test: /\.css$/,
          use: ["style-loader","css-loader"]
        }, {
          test: /\.js$/,
          exclude: /node_modules/,
          loader: 'babel-loader'
         }]
      }
    };
    
[/code]


CC BY-SA 4.0
2021-10-08T09:35:25.843
82961
2021-10-08T10:36:55.710
2021-10-08T09:51:55.523
3060
48547
question
reactjs react-native react-jsx reactive-programming react-router-dom
作りながら学ぶreact入門　〜インストール手順 Mac編〜　でエラー


[こちら](https://github.com/yuumi3/react_book/blob/master/projects/hello_react/package.json#L32)
を見ると `"^3.11.2"` が指定されていますので、`package.json`を同じように書き換えた上で

[code]

      "devDependencies": {
        ...
        "webpack-dev-server": "^3.11.2"
      }
    
[/code]

次のコマンドを実行すれば動作するでしょう。

[code]

    npm install
    npm start
    
[/code]

* * *

[リファレンス](https://webpack.js.org/configuration/dev-server/)
から辿れる[移行ガイド](https://github.com/webpack/webpack-dev-
server/blob/master/migration-v4.md)にありますが、エラーメッセージに出ている `publicPath`
の設定書式はバージョン `3` のものです。  
[説明](https://github.com/yuumi3/react_book/blob/master/docs/install_mac.md#2-7-npm%E3%83%91%E3%83%83%E3%82%B1%E3%83%BC%E3%82%B8%E3%81%AE%E3%82%A4%E3%83%B3%E3%82%B9%E3%83%88%E3%83%BC%E3%83%AB)通りコマンドを実行すると(発刊当時の2017年とは異なり)2021年現在では現行バージョンである
`4` がインストールされますので、ダウングレードする必要があります。


CC BY-SA 4.0
2021-10-08T10:20:06.670
82962
2021-10-08T10:36:55.710
2021-10-08T10:36:55.710
2808
2808
82961
answer