[英]Module not found when run build webpack with ejs module
我有一个简单的项目,我使用 ejs 模块和 webpack 没有很多配置。
当我使用节点运行 index.js 时,一切都很好。
当我尝试运行构建时,我收到以下错误消息:
错误信息:
PS C:\Users\Florian\Desktop\template_ejs_webpack> npm run build-prod
> template_mit_ejs@1.0.0 build-prod C:\Users\Florian\Desktop\template_ejs_webpack
> webpack --mode production
assets by status 10.1 KiB [cached] 1 asset
modules by path ./node_modules/ejs/lib/*.js 30.1 KiB
./node_modules/ejs/lib/ejs.js 26.1 KiB [built] [code generated]
./node_modules/ejs/lib/utils.js 4.07 KiB [built] [code generated]
./src/index.js 301 bytes [built] [code generated]
./node_modules/ejs/package.json 1.47 KiB [built] [code generated]
ERROR in ./node_modules/ejs/lib/ejs.js 47:9-22
Module not found: Error: Can't resolve 'fs' in 'C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\lib'
resolve 'fs' in 'C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\lib'
Parsed request is a module
using description file: C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\package.json (relative path: ./lib)
Field 'browser' doesn't contain a valid alias configuration
resolve as module
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\lib\node_modules doesn't exist or is not a directory
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\node_modules doesn't exist or is not a directory
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\node_modules doesn't exist or is not a directory
looking for modules in C:\Users\Florian\Desktop\template_ejs_webpack\node_modules
single file module
using description file: C:\Users\Florian\Desktop\template_ejs_webpack\package.json (relative path: ./node_modules/fs)
no extension
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\fs doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\fs.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\fs.json doesn't exist
.wasm
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\fs.wasm doesn't exist
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\fs doesn't exist
C:\Users\Florian\Desktop\node_modules doesn't exist or is not a directory
C:\Users\Florian\node_modules doesn't exist or is not a directory
C:\Users\node_modules doesn't exist or is not a directory
C:\node_modules doesn't exist or is not a directory
@ ./src/index.js 4:12-26
ERROR in ./node_modules/ejs/lib/ejs.js 48:11-26
Module not found: Error: Can't resolve 'path' in 'C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\lib'
BREAKING CHANGE: webpack < 5 used to include polyfills for node.js core modules by default.
This is no longer the case. Verify if you need this module and configure a polyfill for it.
If you want to include a polyfill, you need to:
- add a fallback 'resolve.fallback: { "path": require.resolve("path-browserify") }'
- install 'path-browserify'
If you don't want to include a polyfill, you can use an empty module like this:
resolve.fallback: { "path": false }
resolve 'path' in 'C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\lib'
Parsed request is a module
using description file: C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\package.json (relative path: ./lib)
Field 'browser' doesn't contain a valid alias configuration
resolve as module
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\lib\node_modules doesn't exist or is not a directory
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\ejs\node_modules doesn't exist or is not a directory
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\node_modules doesn't exist or is not a directory
looking for modules in C:\Users\Florian\Desktop\template_ejs_webpack\node_modules
single file module
using description file: C:\Users\Florian\Desktop\template_ejs_webpack\package.json (relative path: ./node_modules/path)
no extension
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\path doesn't exist
.js
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\path.js doesn't exist
.json
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\path.json doesn't exist
.wasm
Field 'browser' doesn't contain a valid alias configuration
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\path.wasm doesn't exist
C:\Users\Florian\Desktop\template_ejs_webpack\node_modules\path doesn't exist
C:\Users\Florian\Desktop\node_modules doesn't exist or is not a directory
C:\Users\Florian\node_modules doesn't exist or is not a directory
C:\Users\node_modules doesn't exist or is not a directory
C:\node_modules doesn't exist or is not a directory
@ ./src/index.js 4:12-26
webpack 5.24.1 compiled with 2 errors in 906 ms
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! template_mit_ejs@1.0.0 build-prod: `webpack --mode production`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the template_mit_ejs@1.0.0 build-prod script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Florian\AppData\Roaming\npm-cache\_logs\2021-02-24T13_35_40_240Z-debug.log
文件夹结构:
template_ejs_webpack
|--dist
| |--index.html
|--node_modules
|--src
| |--index.js
|--package-lock.json
|--package.json
|--template.ejs
|--webpack.config.js
index.js:
"use strict"
const ejs = require("ejs")
const planet = "Mars"
ejs
.renderFile("./template.ejs", { planetVar: planet })
.then((templateHTML) => {
console.log(templateHTML)
})
索引.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="output"></div>
<script src="./main.js"></script>
</body>
</html>
模板.ejs:
<p>Mission accomplished. Landed on <%= planetVar %></p>
package.json:
{
"name": "template_mit_ejs",
"version": "1.0.0",
"description": "",
"main": "script.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack",
"build-prod": "webpack --mode production",
"watch": "webpack --watch"
},
"author": "",
"license": "ISC",
"dependencies": {},
"devDependencies": {
"ejs": "^3.1.6",
"ejs-loader": "^0.5.0",
"webpack": "^5.24.1",
"webpack-cli": "^4.5.0"
}
}
webpack.config.js:
module.exports = {
mode: 'development',
target: 'web',
module: {
rules: [
{
test: /\.ejs$/,
use: {
loader: 'ejs-loader'
}
}
]
}
};
有人建议我的代码有什么问题吗?
首先,您的配置似乎缺少一个入口点。 有很多缺失的信息,我强烈建议您查看 webpacks文档以获取模块解析。
您可能还想排除 node_modules。
module: {
...
rules{
...
exclude: ["/node_modules/"]
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.