#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 досье.