Question

我目前正在学习 djangoRest 和 React 课程。我在 npm 和 python 上有经验，但这个错误是我无法解决的。一切都很顺利，直到我“npm run dev”

package.json 文件

{
  "name": "frontend",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "webpack --mode development --watch",
    "build": "webpack --mode production"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.13.16",
    "@babel/preset-env": "^7.13.15",
    "@babel/preset-react": "^7.13.13",
    "babel-loader": "^8.2.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "webpack": "^5.34.0",
    "webpack-cli": "^4.6.0"
  },
  "dependencies": {
    "@babel/plugin-proposal-class-properties": "^7.13.0",
    "@material-ui/core": "^4.11.3",
    "@material-ui/icons": "^4.11.2",
    "react-router-dom": "^5.2.0"
  }
}

webpack.config.js 文件

const path = require("path");
const webpack = require("webpack");

module.exports = {
  entry: "./src/index.js",
  output: {
    path: path.resolve(__dirname, "./static/frontend"),
    filename: "[name].js",
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        use: {
          loader: "babel-loader",
        },
      },
    ],
  },
  optimization: {
    minimize: true,
  },
  plugins: [
    new webpack.DefinePlugin({
      "process.env": {
        // This has effect on the react lib size
        NODE_ENV: JSON.stringify("production"),
      },
    }),
  ],
};

错误

npm run dev

> frontend@1.0.0 dev E:\Programacion cursos\Harvard\React&JavaScript\VsCode\react_django\frontend
> webpack --mode development --watch

"JavaScript\VsCode\react_django\frontend\node_modules\.bin\" no se reconoce como un comando interno o externo,
programa o archivo por lotes ejecutable.
internal/modules/cjs/loader.js:883
  throw err;
  ^

Error: Cannot find module 'E:\Programacion cursos\Harvard\webpack\bin\webpack.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12)
    at internal/main/run_main_module.js:17:47 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! frontend@1.0.0 dev: `webpack --mode development --watch`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the frontend@1.0.0 dev 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 在哪里搜索 webpack.js 存档。目前 webpack.js 的路线是 E:\Programacion cursos\Harvard\React&JavaScript\VsCode\react_django\frontend\node_modules\webpack\bin\webpack.js 但我不知道为什么要在 E:\Programacion cursos\Harvard\webpack\bin\webpack.js

中搜索该模块

我想更改 npm 搜索 webpack 模块的位置，但我不知道如何。我尝试了 npm link webpack 和 npm unlink webpack 再次安装它，但它不起作用。如果有人知道怎么做，请帮助我。谢谢！

编辑我解决了其中一个问题。将 node_module\.bin 文件夹更改为 node_module\bin

在 node_modules 中，有 graceful-fs 模块。我能做什么？错误是：

Error: Cannot find module 'graceful-fs'
Require stack:
- C:\Users\matia\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js       
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:880:15)
    at Function.Module._load (internal/modules/cjs/loader.js:725:27)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at Object.<anonymous> (C:\Users\matia\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js:77:13)
    at Module._compile (internal/modules/cjs/loader.js:1063:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Function.executeUserEntryPoint [as runMain] (internal/modules/run_main.js:72:12) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'C:\\Users\\matia\\AppData\\Roaming\\npm\\node_modules\\webpack\\bin\\webpack.js'
  ]

Answer 1

我从上面的目录运行 npm。 npm 模块、webpack 输入、webpack 输出、webpack 配置、package.json 和 package-lock.json 位于同一目录中。这是我的 webpack 配置，例如..

var path = require ('path');

module.exports = {
    entry : './webpack-entry',
    mode : 'production',
    output : {
        filename : 'webpack-output.js',
        path : path.resolve(__dirname),
        library : {
            name: 'chartModule',
            type : 'umd'
        }
    },
}

npm run 找不到模块优雅-fs

1 个答案: