Не удалось заставить докер работать с реагировать и веб-пакетом - PullRequest
0 голосов
/ 15 декабря 2018

Итак, я работаю над этой проблемой большую часть недели и чувствую, что ничего не получила, несмотря на то, что прочитала много статей на эту тему и прочитала много вопросов о переполнении стека.У меня есть следующие файлы docker-compose.yml и Dockerfile.dev, которые я пытаюсь использовать в следующей статье: https://blog.bam.tech/developper-news/dockerize-your-app-and-keep-hot-reloading. Несколько различий между моей реализацией и этой статьей.Я не могу использовать каталог node_modules, насколько мне известно с моего компьютера (OSX), так как я пытаюсь запустить Docker в среде Linux, поэтому мне нужно запустить npm install изнутри Docker.У меня еще не реализован API-интерфейс (он будет готов, я просто хочу, чтобы это сначала заработало), поэтому все ссылки на api удалены.

Это мой docker-compose.yml:

version: '3'
services:
  server:
    container_name: server
    build: ./server
    ports:
      - '80:80'
    links:
      - app:app
  app:
    container_name: app
    build:
      context: ../retail
      dockerfile: Dockerfile.dev
    ports:
      - '9000:9000'
    volumes:
      - ../retail:/usr/src/app/
    environment:
      - NODE_ENV=development
      - NPM_CONFIG_PRODUCTION=false
  db:
    container_name: database
    build: ./database
    environment:
      POSTGRES_PASSWORD: supersecretpasswordthatnobodyknows
      POSTGRES_USER: devsuperuser
      POSTGRES_DB: lending
    restart: always
    ports:
      - '5432:5432'
    volumes:
      - /var/lib/postgresql/data

И это мой Dockerfile.dev, на который ссылаются выше:

FROM node:alpine

WORKDIR /usr/src/app

COPY ./package.json ./.npmrc ./

RUN npm install webpack webpack-cli webpack-server webpack-hot-client -g
RUN npm link webpack webpack-dev-server && npm install

EXPOSE 9000
CMD ["npm", "run", "start:dev"]

Некоторые из вещей, которые я пробовал, находятся в приведенном выше коде.Например, от NPM_CONFIG_PRODUCTION до false.И установить все webpack глобально, а затем связать его.Я обнаружил, что если я не сделал последнее, я получил ошибки о невозможности найти веб-пакет.Я пробовал несколько комбинаций разных идей из целого ряда статей, но независимо от того, что я пробовал, у меня постоянно возникают проблемы с тем или иным отсутствующим модулем.

Мне просто интересно, кто-томожет помочь мне заставить эту статью работать на меня, хотя мне нужно сделать npm install.Или, может быть, даже каким-то образом я могу сделать npm install локально и не нужно делать это в контейнере Docker (потому что это работает).

РЕДАКТИРОВАТЬ: я добавляю другой файл и часть файла, которыйможет или не может иметь отношение ниже в ответ на комментарий с просьбой о них.

webpack.config.js

const webpack = require('webpack');
const path = require('path');
const autoprefixer = require('autoprefixer');

module.exports = {
  devtool: 'eval-source-map',
  context: __dirname,
  entry: [
    'babel-polyfill',
    // 'react-hot-loader/patch',
    'webpack-dev-server/client?http://0.0.0.0:9000',
    'webpack/hot/only-dev-server',
    './src/index.js',
  ],
  output: {
    path: path.join(__dirname, 'www'),
    filename: 'bundle.js',
    publicPath: '/',
  },
  devServer: {
    disableHostCheck: true,
    historyApiFallback: true,
    inline: false,
    port: 9000,
    hot: true,
    proxy: {
      '/v1': {
        target: 'an IP address',
      },
    },
  },
  module: {
    loaders: [
      {
        test: /\.(css|scss)$/,
        use: [
          'style-loader',
          { loader: 'css-loader' },
          'sass-loader',
        ],
      },
      {
        test: /\.(png|jpg|svg|woff|woff2|ttff|eot|ttf)$/,
        loader: 'url-loader?limit=25000',
      },
      {
        test: /\.js$/,
        loader: 'babel-loader',
        include: [
          path.join(__dirname, 'src'),
        ],
        exclude: /node_modules/,
        options: {
          // This is a feature of `babel-loader` for Webpack (not Babel itself).
          // It enables caching results in ./node_modules/.cache/babel-loader/
          // directory for faster rebuilds.
          cacheDirectory: true,
          // plugins: ['react-hot-loader/babel'],
        },
      },
      {
        test: /config\.js$/,
        loaders: 'string-replace-loader',
        query: {
          multiple: [
            { search: '{{API_SERVER}}', replace: '' },
          ],
        },
      },
    ],
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        NODE_ENV: JSON.stringify(process.env.NODE_ENV),
      },
    }),
    new webpack.HotModuleReplacementPlugin(),
    new webpack.LoaderOptionsPlugin({ options: { postcss: [autoprefixer] } }),
  ],
};

И мое определение сценария для start:dev в моем package.json

"start:dev": "webpack-dev-server --host 0.0.0.0 --hot --inline",
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...