diff --git a/.github/workflows/deploy_dev.yml b/.github/workflows/deploy_dev.yml index acec9f41c..4cdb452db 100644 --- a/.github/workflows/deploy_dev.yml +++ b/.github/workflows/deploy_dev.yml @@ -4,6 +4,9 @@ on: push: branches: - develop + pull_request: + branches: + - develop jobs: deploy-dev: @@ -13,8 +16,6 @@ jobs: id: date run: echo "::set-output name=date::$(TZ='Europe/Helsinki' date +'%d.%m.%Y_%H:%M')" - uses: actions/checkout@v4 - with: - ref: develop - name: Build UI and publish Docker image uses: elgohr/Publish-Docker-Github-Action@v5 with: diff --git a/Dockerfile b/Dockerfile index cccdb6cc6..79fef2278 100644 --- a/Dockerfile +++ b/Dockerfile @@ -1,15 +1,12 @@ -FROM node:12.16.1-alpine AS builder +FROM node:20-alpine AS builder ENV WORK=/opt/joremapui - -RUN mkdir -p ${WORK} WORKDIR ${WORK} -# Install app dependencies -COPY yarn.lock package.json .yarnrc ${WORK} -RUN yarn +COPY package.json yarn.lock .yarnrc ./ +RUN yarn install --frozen-lockfile -COPY . ${WORK} +COPY . . ARG APP_ENVIRONMENT ENV ENVIRONMENT=${APP_ENVIRONMENT} @@ -30,14 +27,10 @@ RUN yarn build FROM node:20-alpine AS server ENV WORK=/opt/joremapui - -# Create app directory -RUN mkdir -p ${WORK} WORKDIR ${WORK} -# Install serve RUN yarn global add serve@^14.2.3 -COPY --from=builder /opt/joremapui/build build/ +COPY --from=builder /opt/joremapui/build ./build -CMD ["serve", "-s", "-l", "5000", "build/"] +CMD ["serve", "-s", "-l", "5000", "build"] \ No newline at end of file diff --git a/config/webpack.config.dev.js b/config/webpack.config.dev.js index 84eeee62b..653b613d0 100644 --- a/config/webpack.config.dev.js +++ b/config/webpack.config.dev.js @@ -5,13 +5,8 @@ const path = require('path'); const webpack = require('webpack'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const CaseSensitivePathsPlugin = require('case-sensitive-paths-webpack-plugin'); -const InterpolateHtmlPlugin = require('react-dev-utils/InterpolateHtmlPlugin'); -const WatchMissingNodeModulesPlugin = require('react-dev-utils/WatchMissingNodeModulesPlugin'); -const ModuleScopePlugin = require('react-dev-utils/ModuleScopePlugin'); -const ForkTsCheckerWebpackPlugin = require('fork-ts-checker-webpack-plugin'); const getClientEnvironment = require('./env'); const paths = require('./paths'); -const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin'); // Webpack uses `publicPath` to determine where the app is being served from. // In development, we always serve from the root. This makes config easier. @@ -27,6 +22,7 @@ const env = getClientEnvironment(publicUrl); // It is focused on developer experience and fast rebuilds. // The production configuration is different and lives in a separate file. module.exports = { + mode: 'development', // You may want 'eval' instead if you prefer to see the compiled output in DevTools. // See the discussion in https://github.com/facebookincubator/create-react-app/issues/343. devtool: 'cheap-module-source-map', @@ -36,17 +32,8 @@ module.exports = { entry: [ // We ship a few polyfills by default: require.resolve('./polyfills'), - // Include an alternative client for WebpackDevServer. A client's job is to - // connect to WebpackDevServer by a socket and get notified about changes. - // When you save a file, the client will either apply hot updates (in case - // of CSS changes), or refresh the page (in case of JS changes). When you - // make a syntax error, this client will display a syntax error overlay. - // Note: instead of the default WebpackDevServer client, we use a custom one - // to bring better experience for Create React App users. You can replace - // the line below with these two lines if you prefer the stock client: - // require.resolve('webpack-dev-server/client') + '?/', - // require.resolve('webpack/hot/dev-server'), - require.resolve('react-dev-utils/webpackHotDevClient'), + require.resolve('webpack-dev-server/client') + '?/', + require.resolve('webpack/hot/dev-server'), // Finally, this is your app's code: paths.appIndexJs // We include the app code last so that if there is a runtime error during @@ -69,20 +56,9 @@ module.exports = { path.resolve(info.absoluteResourcePath).replace(/\\/g, '/') }, resolve: { - // This allows you to set a fallback for where Webpack should look for modules. - // We placed these paths second because we want `node_modules` to "win" - // if there are any conflicts. This matches Node resolution mechanism. - // https://github.com/facebookincubator/create-react-app/issues/253 modules: ['node_modules', paths.appNodeModules].concat( - // It is guaranteed to exist because we tweak it in `env.js` process.env.NODE_PATH.split(path.delimiter).filter(Boolean) ), - // These are the reasonable defaults supported by the Node ecosystem. - // We also include JSX as a common component filename extension to support - // some tools, although we do not recommend using it, see: - // https://github.com/facebookincubator/create-react-app/issues/290 - // `web` extension prefixes have been added for better support - // for React Native Web. extensions: [ '.mjs', '.web.ts', @@ -96,27 +72,26 @@ module.exports = { '.jsx' ], alias: { - // Support React Native Web - // https://www.smashingmagazine.com/2016/08/a-glimpse-into-the-future-with-react-native-for-web/ 'react-native': 'react-native-web' }, - plugins: [ - // Prevents users from importing files from outside of src/ (or node_modules/). - // This often causes confusion because we only process files within src/ with babel. - // To fix this, we prevent you from importing files out of src/ -- if you'd like to, - // please link the files into your node_modules/ and let module-resolution kick in. - // Make sure your source files are compiled, as they will not be processed in any way. - new ModuleScopePlugin(paths.appSrc, [paths.appPackageJson]), - new TsconfigPathsPlugin({ configFile: paths.appTsConfig }) - ] + tsconfig: paths.appTsConfig, + fallback: { + dgram: false, + fs: false, + net: false, + tls: false, + child_process: false, + }, }, module: { strictExportPresence: true, rules: [ - // TODO: Disable require.ensure as it's not a standard language feature. - // We are waiting for https://github.com/facebookincubator/create-react-app/issues/2176. - // { parser: { requireEnsure: false } }, - + { + test: /\.m?js$/, + resolve: { + fullySpecified: false, + }, + }, { test: /\.(js|jsx|mjs)$/, loader: require.resolve('source-map-loader'), @@ -166,31 +141,28 @@ module.exports = { { test: /\.scss$/, use: [ - 'style-loader', // creates style nodes from JS strings + require.resolve('style-loader'), { - loader: require.resolve('typings-for-css-modules-loader'), + loader: require.resolve('css-loader'), options: { - modules: true, + url: false, + importLoaders: 1, + esModule: true, + modules: { namedExport: true, + exportLocalsConvention: 'camelCaseOnly', localIdentName: '[local]-[hash:base64:4]', - camelCase: true, - importLoaders: 1 - } + }, + }, }, { - loader: 'sass-loader', + loader: require.resolve('sass-loader'), options: { - // Prefer `dart-sass` - implementation: require('sass') - } - } // compiles Sass to CSS, using Dart Sass - ] + implementation: require('sass'), + }, + }, + ], }, - // "postcss" loader applies autoprefixer to our CSS. - // "css" loader resolves paths in CSS and adds assets as dependencies. - // "style" loader turns CSS into JS modules that inject