运行“npm run”时无法解析“react”

Question

我的项目最近开始抱怨当我运行 npm run dev 脚本时它无法解析反应，即： cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js

npm 好像找不到 node_modules 目录？

它在我的 Windows 机器上运行良好，但是当我将它上传到 Ubuntu 服务器时出现错误。 我尝试了各种方法，比如删除 node_modules 和锁定文件，清理 npm 缓存，检查 $NODE_PATH，重新安装 nodejs 和 npm 无济于事。 我不知道这是路径问题还是我在服务器上遗漏了一些东西或什么。

如果您有任何建议，我将不胜感激。

我的 package.json：

{
    "private": true,
    "name": "Write.nogetdigitalt.dk",
    "version": "0.0.1",
    "scripts": {
        "dev": "npm run development",
        "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
        "watch": "npm run development -- --watch",
        "watch-poll": "npm run watch -- --watch-poll",
        "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
        "prod": "npm run production",
        "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
    },
    "devDependencies": {
        "@fortawesome/react-fontawesome": "^0.1.3",
        "axios": "^0.18",
        "babel-preset-react": "^6.24.1",
        "bootstrap": "^4.0.0",
        "cross-env": "^5.1",
        "jquery": "^3.2",
        "laravel-mix": "^2.0",
        "lodash": "^4.17.5",
        "moment": "^2.23.0",
        "popper.js": "^1.12",
        "react": "^16.5.2",
        "react-datepicker": "^2.0.0",
        "react-dom": "^16.5.2",
        "redux": "^4.0.1",
        "vue": "^2.5.7"
    },
    "dependencies": {
        "@fortawesome/free-solid-svg-icons": "^5.5.0",
        "react-icons": "^3.2.0"
    }
}

webpack.mix.js

const mix = require('laravel-mix');
const webpack = require('webpack');

mix.webpackConfig({
    resolve: {
        extensions: ['.js', 'jsx'],
        alias: {
            'react': 'React'
        }
    },
    plugins: [
        new webpack.ProvidePlugin({
            'React': 'react',
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            Popper: ['popper.js', 'default']
        })
    ]
})
.disableNotifications()

.react('resources/js/app.js', 'public/js')
    .sourceMaps()
.sass('resources/sass/app.scss', 'public/css');

错误信息：

ERROR in ./resources/js/pages/Note/Note.js
Module not found: Error: Can't resolve 'react' in '/var/www/html/write.nogetdigitalt.dk/resources/js/pages/Note'
resolve 'react' in '/var/www/html/write.nogetdigitalt.dk/resources/js/pages/Note'
  Parsed request is a module
  using description file: /var/www/html/write.nogetdigitalt.dk/package.json (relative path: ./resources/js/pages/Note)
    aliased with mapping 'react': 'React' to 'React'
      Parsed request is a module
      using description file: /var/www/html/write.nogetdigitalt.dk/package.json (relative path: ./resources/js/pages/Note)
        Field 'browser' doesn't contain a valid alias configuration
      after using description file: /var/www/html/write.nogetdigitalt.dk/package.json (relative path: ./resources/js/pages/Note)
        resolve as module
          /var/www/html/write.nogetdigitalt.dk/resources/js/pages/Note/node_modules doesn't exist or is not a directory
          /var/www/html/write.nogetdigitalt.dk/resources/js/pages/node_modules doesn't exist or is not a directory
          /var/www/html/write.nogetdigitalt.dk/resources/js/node_modules doesn't exist or is not a directory
          /var/www/html/write.nogetdigitalt.dk/resources/node_modules doesn't exist or is not a directory
          /var/www/html/node_modules doesn't exist or is not a directory
          /var/www/node_modules doesn't exist or is not a directory
          /var/node_modules doesn't exist or is not a directory
          /node_modules doesn't exist or is not a directory

Answer 1

对于遇到此类问题的其他人，对于不同操作系统之间的路径定义，最好使用 NodeJS 中的path

`const path = require('path');
[...]
resolve: {
        extensions: ['.js', 'jsx'],
        alias: {
            'react': path.resolve(__dirname, 'Path to your folder to alias')
        }
    }`

Answer 2

您没有安装包依赖项。

npm install

执行后，节点模块目录已创建。 并启动您的应用程序。

npm run developement