ОШИБКА WEBPACK5 в основном модуле не найдена: Ошибка: не удается разрешить ‘. / src’

#javascript #node.js #express #webpack #babeljs

#javascript #node.js #выразить #webpack #babeljs

Вопрос:

Вы хотите создавать только файлы, связанные с сервером Express и gql, отдельно, используя webpack5.
Однако при сборке возникает ошибка.

ОШИБКА в основном
модуле не найдена: Ошибка: не удается разрешить ‘. / src’ в ‘/Users/leedonghee/ Dropbox/Project / observer/Homepage/ v2/server

Мои файлы нигде не используют ./src.

Реж


 server(root)
├─ dist
├─ model(mongoose amp; gql)
│   ├─ schema.js
│   └─ main-sliders
│       ├─ model.js
│       ├─ resolver.js
│       └─ schema.graphql
├─ node_modules
├─ index.js
├─ webpack.config.js
├─ .babelrc
├─ .env
├─ package.json
├─ package-lock.json
└─ ...
 

package.json


 {
  "name": "server",
  "version": "1.0.0",
  "description": "",
  "private": true,
  "scripts": {
    "dev:server": "NODE_ENV=development nodemon --exec babel-node index.js",
    "build": "webpack --mode production --progress",
    "start:server": "NODE_ENV=production node ./build/index.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "core-js": "^3.8.1",
    "cors": "^2.8.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "express-graphql": "^0.12.0",
    "graphql": "^15.4.0",
    "graphql-tools": "^7.0.2",
    "merge-graphql-schemas": "^1.7.8",
    "mongoose": "^5.11.7",
    "path-browserify": "^1.0.1",
    "regenerator-runtime": "^0.13.7"
  },
  "devDependencies": {
    "@babel/cli": "^7.12.10",
    "@babel/core": "^7.12.10",
    "@babel/node": "^7.12.10",
    "@babel/preset-env": "^7.12.11",
    "babel-loader": "^8.2.2",
    "clean-webpack-plugin": "^3.0.0",
    "nodemon": "^2.0.6",
    "webpack": "^5.10.3",
    "webpack-cli": "^4.2.0",
    "webpack-graphql-loader": "^1.0.2"
  }
}

 

webpack.config.js


 const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const path = require("path");

module.export = {
  entry: "index.js",
  mode: "production",
  target: "node",
  resolve: {
    modules: ["node_modules"],
    extensions: [".js", ".json"],
    fallback: { path: require.resolve("path-browserify") },
  },
  output: {
    publicPath: "/",
    path: path.resolve(__dirname, "build"),
    filename: "index.js",
  },
  module: {
    rules: [
      {
        test: /.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
        },
      },
      {
        test: /.graphql?$/,
        use: [
          {
            loader: "webpack-graphql-loader",
            options: {
              minify: true,
            },
          },
        ],
      },
    ],
  },
  plugins: [new CleanWebpackPlugin()],
};


 

index.js


 import express from "express";
import dotenv from "dotenv";
import cors from "cors";
import mongoose from "mongoose";
const { graphqlHTTP } = require("express-graphql");
import schema from "./models/schema";
import "core-js/stable";
import "regenerator-runtime/runtime";

const app = express();
// env --------------------------------------------
dotenv.config();
const { PROD_PORT, DEV_PORT, DB_NAME, DB_URI, NODE_ENV } = process.env;
const port = NODE_ENV === "development" ? DEV_PORT : PROD_PORT;

// DB Setting --------------------------------------------
mongoose.Promise = global.Promise; // db서버 비동기처리
mongoose.connect(DB_URI, {
  useNewUrlParser: true,
  useFindAndModify: false,
  useCreateIndex: true,
  useUnifiedTopology: true,
});
mongoose.connection.once("open", () =>
  console.log(`🗄  Connected to "${DB_NAME}" MongoDB server.`)
);
mongoose.connection.on("error", (error) => console.error(`🚫 Error: :`, error));

// Get React Build File --------------------------------------------
const homepage = require("path").join(__dirname, "..", "homepage", "build");
app.use(express.static(homepage));
app.get("/", (req, res) => {
  res.sendFile("index.html", { homepage });
});

app.use(
  "/graphql",
  cors(),
  graphqlHTTP({
    schema: schema,
    graphiql: NODE_ENV === "development" ? true : false,
  })
);

app.listen(port, () => {
  console.log(
    `n🚀 Server running on http://localhost:${port}n${
      NODE_ENV === "development" ? "⚙️  Development" : "📡  Production"
    } mode`
  );
});

 

.babelrc


 {
    "presets": [
        ["@babel/preset-env" ,
            {
              "useBuiltIns" : "usage" ,
              "corejs" : 3
            }]
    ]
}

 

Комментарии:

1. Разве проблема не в том, что у вас есть «module.export» вместо «module.exports»?

Ответ №1:

У меня была та же проблема. «Модуль не найден: Ошибка: не удается разрешить ‘. / src’ в» . Я тоже новичок в webpack и не знаю, является ли ‘src’ обязательным каталогом или нет. Тем не менее, я создал каталог src в папке моих проектов, где package.json и webpack.config.js присутствовали, а затем переместили мой index.js в каталоге «src». Также, если вы посмотрите документацию по базовой настройке и конфигурации, они оба предполагают, что src является исходной папкой для index.js . Могут быть некоторые дополнительные темы, в которых вы можете обойтись без ‘src’. Хотя я еще не зашел так далеко. РЕДАКТИРОВАТЬ: похоже, вам не нужен каталог src. Вы можете просто определить свою собственную точку входа в свой webpack.config.js досье.