仕事

社内ニート。

Docker

以下の記事の通りにやってみる。

Docker環境内でcreate-react-app

いちいちdocker-composeでrunコマンド打ちたくないのでDockerfileに書いといた。

create-react-appがログにsuccessってでてるのに何もできてない。

なぜ。

結局わからんかった。

スタート地点まで戻って別のアプローチを試してみる。

Docker+webpackを用いたReact.js開発環境の構築

こちらも想定通りに動かない。bundle.jsが生成されない。

てことで見直した。

webpack 4 入門

Webpack.config.jsの書き方が微妙に違う。気がする。

以下の通りに変更して無事

const path = require('path');

module.exports = {
    mode: 'development',
    entry: './src/app.js',
    output: {
        filename: 'bundle.js',
        path: path.join(__dirname, './dist')
    },
    module: {
        rules: [
            {
                loader: 'babel-loader',
                exclude: /node_modules/,
                test: /\.js[x]?$/,
                query: {
                    cacheDirectory: true,
                    presets: ['react', 'es2015']
                }
            }
        ]
    }
};

うご・・・うご・・・動かない・・・。

ローカルでは動いたのに・・・。

もう少し調べて見てwebpackの下のDockerfileを以下のとおりにしたら動いた。

FROM node:8

WORKDIR /app
COPY ./webpack.config.js /app/webpack.config.js

RUN npm init -y
RUN npm install -g webpack webpack-cli
RUN npm install --save react react-dom
RUN npm install --save-dev babel-loader@7 babel-core babel-preset-es2015 babel-preset-react

CMD ["webpack", "-d", "--watch"]

ローカルで動かしてみるとbabel-loaderが6系入ったりしてなんかエラー吐いてたので、念の為7系入れて以下のようにしたり

webpack-cliいれるようにしたりしたら動いた。

まーた時間無駄にかかった。やはり才能ないし努力も足りない。

仕事せずに10年位修行したい。

備考

明日の目標