Home>
A simple react application is created withwebpack
without using create-react-app.
I enabled this app to run onDocker
, but it fails with the following error.
~/hospital master *
❯ docker-compose up
Starting hospital_client_1 ... done
Attaching to hospital_client_1
client_1 |
client_1 |>[email protected] start/app
client_1 |>webpack-dev-server --mode = development "0.0.0.0" "3000"
client_1 |
client_1 | /app/node_modules/webpack-cli/bin/utils/convert-argv.js:547
client_1 | const i = content.indexOf ("=");
client_1 | ^
client_1 |
client_1 | TypeError: content.indexOf is not a function
client_1 | at /app/node_modules/webpack-cli/bin/utils/convert-argv.js:547:23
client_1 | at Array.forEach ()
client_1 | at processOptions (/app/node_modules/webpack-cli/bin/utils/convert-argv.js:546:11)
client_1 | at processConfiguredOptions (/app/node_modules/webpack-cli/bin/utils/convert-argv.js:170:4)
client_1 | at module.exports (/app/node_modules/webpack-cli/bin/utils/convert-argv.js:131:10)
client_1 | at Object. (/app/node_modules/webpack-dev-server/bin/webpack-dev-server.js:84:40)
client_1 | at Module._compile (internal/modules/cjs/loader.js: 777: 30)
client_1 | at Object.Module._extensions..js (internal/modules/cjs/loader.js: 788: 10)
client_1 | at Module.load (internal/modules/cjs/loader.js: 643: 32)
client_1 | at Function.Module._load (internal/modules/cjs/loader.js: 556: 12)
client_1 | npm ERR! code ELIFECYCLE
client_1 | npm ERR! errno 1
client_1 | npm ERR! [email protected] start: `webpack-dev-server --mode = development" 0.0.0.0 "" 3000 "`
client_1 | npm ERR! Exit status 1
client_1 | npm ERR!
client_1 | npm ERR! Failed at the [email protected] start script.
client_1 | npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
client_1 |
client_1 | npm ERR! A complete log of this run can be found in:
client_1 | npm ERR! /root/.npm/_logs/2019-12-02T13_52_45_192Z-debug.log
hospital_client_1 exited with code 1
Applicable source code
hospital
├ client
│ ├ src
│ │ ├ components
│ │ │ └ Demo.tsx
│ │ ├ App.tsx
│ │ ├ index.html
│ │ └ index.tsx
│ ├ Dockerfile
│ ├ package.json
│ └ webpack.config.js
└ docker-compose.yml
Dockerfile
FROM node: alpine
WORKDIR '/ app'
COPY ./package.json ./
RUN npm install
COPY.
EXPOSE 3000
RUN npm start
docker-compose.yml
version: '3'
services:
client:
command: 'npm start --host 0.0.0.0 --port 3000'
build:
dockerfile: Dockerfile
context: ./client
ports:
-'3000: 3000'
volumes:
-/ app/node_modules
-./client:/app
webpack.config.js
const path = require ('path');
const HtmlWebpackPlugin = require ('html-webpack-plugin');
module.exports = {
mode: 'development',
entry: './src/index.tsx',
output: {
path: path.resolve (__ dirname, 'dist'),
filename: 'bundle.js',
},
devServer: {
port: '3000',
hot: true,
open: true,
},
module: {
rules: [
{
test: /\.js(x?)$/,
loader: 'babel-loader',
exclude:/node_modules /,
},
{
test: /\.ts(x?)$/,
loader: 'ts-loader',
exclude:/node_modules /,
},
],
},
plugins: [
new HtmlWebpackPlugin ({
template: './src/index.html',
}),
],
resolve: {
extensions: ['.js', '.ts', '.tsx'],
},
};
package.json
"scripts": {
"test": "echo \" Error: no test specified \ "&&exit 1",
"dev": "webpack-dev-server",
"start": "webpack-dev-server --mode = development"
},
The whole source code is below.
https://github.com/jpskgc/hospital
Start withnpm start
without any problem in the local environment.
-
Answer # 1
Related articles
- python 3x - i want to start a gui application created with kivy in a docker container and display it on a host pc
- docker - rubocop does not start on circleci
- How Docker deploys your first application
- apache - how to start httpdservice on docker run
- Use kind and Docker to start the local Kubernetes environment
- in javafx, exception in application start method
- javascript - i want to start server-side nodejs from an application created with react native
- deployed to heroku completed, but the application did not start with an error
- ios134 the application does not start when killing the application
- Android studio implementation of simple exam application example code
- the development server of the application that created-react-apped in docker environment is immediately terminated
- react website creation-what to start with
- Simple model interpretation and application analysis of javascript event loop
- CentOS7 deploys version 19 docker (simple, you can follow)
- Python pymysql module simple application sample code
- JAVA SPI features and simple application code examples
- Simple understanding and application analysis of PHP call_user_func and call_user_func_array functions
- Start and stop Docker services in batches using shell scripts
- Simple application case analysis of PHP decorator pattern
- Simple application example of php adapter mode
Related questions
- reactjs - i want to resolve build errors due to webpack
- reactjs - error: target container is not a dom element code that works with react does not work with gatbyjs
- after updating docker desktop, local changes are no longer detected
- will build-storybook also build indextsx and apptsx?
- aws - application-xxxxxxxjs becomes not found
- i want to use mediainfojs (webassembly) with reactjs
- javascript - i get a module not found error when building a react environment
- reactjs - i bundled react files with webpack + babel, but i don't see the components i mentioned
- css - font-face is not reflected well in react
- ruby on rails - npm error in building react_on_rails gem environment with docker
The problem has been resolved with the following modifications.
Source: https://stackoverflow.com/questions/59141778/fail-to-run-react-application-on-docker/59154209#59154209
Dockerfile
docker-compose.yml
package.json