Express API с веб-пакетом работает в режиме разработки, но не в рабочем режиме - PullRequest
0 голосов
/ 19 апреля 2020

Я пытаюсь использовать веб-пакет в моем Express API (который использует TS FYI). Я создал три файла webpack.common.js, webpack.dev.js и webpack.prod.js, чтобы иметь разные конфигурации в разных средах.

webpack.common. js

const TsConfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
const nodeExternals = require('webpack-node-externals');

module.exports = {
    entry: './src/app.ts',
    target: 'node',
    externals: [nodeExternals()],
    module: {
        rules: [
            {
                test: /\.ts$/,
                use: 'ts-loader',
                exclude: /node_modules/,
            }
        ]
    },
    resolve: {
        extensions: ['.ts', '.js'],
        plugins: [new TsConfigPathsPlugin({
            extensions: ['.ts', '.js'],
        })],
    },
};

webpack.dev. js

const path = require('path');
const common = require('./webpack.common');
const webpackMerge = require('webpack-merge');

module.exports = webpackMerge(common, {
    mode: 'development',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist'),
        publicPath: 'dist',
    },
    devtool: 'inline-source-map',
});

webpack.prod. js

const path = require('path');
const common = require('./webpack.common');
const mergeWebpack = require('webpack-merge');

module.exports = mergeWebpack(common, {
    // mode: 'production',
    output: {
        filename: 'bundle.js',
        path: path.resolve(__dirname, 'dist'),
    },
    devtool: 'none',
});

А вот мой package.json file.

{
  "name": "express-ts-boilerplate",
  "version": "0.1.0",
  "description": "Express Typescript Boilerplate",
  "main": "src/server.js",
  "author": "mymavourneen.com",
  "scripts": {
    "start": "node dist/bundle.js",
    "build": "webpack --config webpack.prod.js",
    "dev": "webpack --config webpack.dev.js"
  },
  "dependencies": {
    "app-root-path": "^3.0.0",
    "bcrypt": "^3.0.6",
    "cors": "^2.8.5",
    "dotenv": "^8.1.0",
    "express": "^4.17.1",
    "express-pino-logger": "^4.0.0",
    "express-validator": "^6.2.0",
    "firebase-admin": "^8.5.0",
    "helmet": "^3.20.1",
    "jsonwebtoken": "^8.5.1",
    "mongodb": "^3.3.2",
    "mongoose": "^5.6.11",
    "morgan": "^1.10.0",
    "winston": "^3.2.1"
  },
  "devDependencies": {
    "@types/app-root-path": "^1.2.4",
    "@types/bcrypt": "^3.0.0",
    "@types/cors": "^2.8.6",
    "@types/dotenv": "^6.1.1",
    "@types/express": "^4.17.1",
    "@types/express-pino-logger": "^4.0.0",
    "@types/helmet": "^0.0.44",
    "@types/jsonwebtoken": "^8.3.3",
    "@types/mongodb": "^3.3.1",
    "@types/mongoose": "^5.5.16",
    "@types/morgan": "^1.9.0",
    "@types/node": "^12.7.3",
    "@types/winston": "^2.4.4",
    "@typescript-eslint/eslint-plugin": "^2.0.0",
    "@typescript-eslint/parser": "^2.0.0",
    "clean-webpack-plugin": "^3.0.0",
    "eslint": "5",
    "eslint-config-prettier": "^6.1.0",
    "eslint-plugin-prettier": "^3.1.0",
    "husky": "^3.0.5",
    "lint-staged": "^9.2.5",
    "nodemon": "^1.19.1",
    "pino-pretty": "^3.2.1",
    "prettier": "^1.18.2",
    "ts-loader": "^7.0.0",
    "ts-node": "^8.3.0",
    "tsconfig-paths": "^3.9.0",
    "tsconfig-paths-webpack-plugin": "^3.2.0",
    "typescript": "^3.6.2",
    "webpack": "^4.42.1",
    "webpack-cli": "^3.3.11",
    "webpack-dev-server": "^3.10.3",
    "webpack-merge": "^4.2.2",
    "webpack-node-externals": "^1.7.2"
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "src/**/*.{ts,json,css,md}": [
      "prettier --single-quote --write",
      "git-add"
    ]
  },
  "nodemonConfig": {
    "ignore": [
      "**/*.test.ts",
      "**/*.spec.ts",
      ".git",
      "node_modules"
    ],
    "watch": [
      "src"
    ],
    "exec": "NODE_ENV=development node -r tsconfig-paths/register -r ts-node/register ./src/app.ts",
    "ext": "ts, js"
  }
}

Теперь, если я выполню npm run dev, он создаст файлы, и я получу файл bundle.js в папке dist, как и ожидалось. Если я сейчас запускаю npm start, который запускает файл комплекта. js, сервер запускается как положено, и все работает нормально.

Теперь, если я выполню npm run build, он создаст рабочую версию bundle.js. Теперь, если я запускаю npm start, он запускает связку. js, но он просто застревает в терминале. Логов нет, сервер не запускается. Он просто зависает после запуска файла bundle.js с использованием npm start.

Единственное различие, которое я вижу, состоит в том, что режим отличается в обоих методах. Остальная конфигурация почти такая же, но мой API не работает с производственной сборкой. Работает только с разработкой.

Вот снимок экрана, когда процесс зависает после запуска производственной сборки.

enter image description here

ПРИМЕЧАНИЕ: ys является псевдоним для yarn start

Есть что-то, что я здесь скучаю? Я новичок в вебпаке и буду очень признателен за помощь

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...