Итак, я работаю над этой проблемой большую часть недели и чувствую, что ничего не получила, несмотря на то, что прочитала много статей на эту тему и прочитала много вопросов о переполнении стека.У меня есть следующие файлы 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",