php - 无法使用 "npm run watch"编译 sass - Laravel

Question

好的。我正在通过 udemy 学习 Laravel 类(class)，所有的样式都是用 sass 完成的。我遵循了与教练相同的步骤，但我遇到了错误，而他的工作正常。有人可以帮忙吗？我在 Windows 上，他在 MAC 上

我使用 Composer 安装了 Laravel，然后迁移了我的数据库表。

我们要做的下一件事是使用安装 Node 和东西

npm install

问题就出在这里。我没有得到 Node 模块文件夹，而他却得到了。要获取 Node 模块文件夹，我需要运行

npm install node-laravel But the folders contained different contents.

在我将 sass 文件夹添加到 Laravel 中并编译它们后，他运行了

npm run watch

SASS 为他完美编译，而我却遇到了这个错误

    > @ watch C:\Users\andre\Dropbox\Code\Personal\CodingPhase\PHP-7\DesignSt
orm
> cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --wa
tch --progress --hide-modules --config=node_modules/laravel-mix/setup/web
pack.config.js

The system cannot find the path specified.
events.js:183
      throw er; // Unhandled 'error' event
      ^

Error: spawn node_modules\webpack\bin\webpack.js ENOENT

    at notFoundError (C:\Users\andre\AppData\Roaming\npm\node_modules\cro
ss-env\node_modules\cross-spawn\lib\enoent.js:11:11)
    at verifyENOENT (C:\Users\andre\AppData\Roaming\npm\node_modules\cros
s-env\node_modules\cross-spawn\lib\enoent.js:46:16)
    at ChildProcess.cp.emit (C:\Users\andre\AppData\Roaming\npm\node_modu
les\cross-env\node_modules\cross-spawn\lib\enoent.js:33:19)
    at Process.ChildProcess._handle.onexit (internal/child_process.js:198
:12)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ watch: `cross-env NODE_ENV=development node_modules/webpack/bi
n/webpack.js --watch --progress --hide-modules --config=node_modules/lara
vel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the @ watch script.
npm ERR! This is probably not a problem with npm. There is likely additio
nal logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\andre\AppData\Roaming\npm-cache\_logs\2018-01-27T20
_14_57_489Z-debug.log

编辑

这是package.json

{

  "private": true,
  "scripts": {
    "dev": "npm run development",
    "development": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "node node_modules/cross-env/dist/bin/cross-env.js 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": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "devDependencies": {
    "axios": "^0.15.3",
    "bootstrap-sass": "^3.3.7",
    "cross-env": "^3.2.3",
    "jquery": "^3.1.1",
    "laravel-mix": "0.*",
    "lodash": "^4.17.4",
    "vue": "^2.1.10"
  },
  "dependencies": {
    "nodejs": "0.0.0"
  }
}

Answer 1

npm install是告诉 npm 的命令( Node 包管理器)安装 package.json 中列出的包。命令npm install node-laravel告诉 npm 安装包 node-laravel 这是一个“[...]用于与 Laravel 交互操作的 Node.js 库”。运行npm install node-laravel正在创建 node_modules文件夹，因为您正在安装一个包，但它是错误的包: node-laravel不是您要找的。

您遇到的问题是npm install未安装 package.json 中列出的依赖项那么让我们来看看为什么会这样。

package.json 中列出了 2 种类型的依赖项, dependencies和devDependencies正如您从 package.json 中看到的，所有依赖项都位于 devDependencies 中。 devDependencies 仅在您处于开发环境中时安装，它们不会安装在生产环境中。这是(大致)发生的情况:

1. 您运行npm install
2. npm 安装 dependencies 中列出的所有内容
3. npm 确定您所处的环境类型
4. 如果您位于development npm 还将安装devDependencies 中列出的软件包。

您的dependencies仅列为 nodejs因此 npm 无需安装任何内容，因此 npm 不需要创建 node_modules文件夹。因此，您遇到的问题(npm 没有安装 devDependencies 中列出的软件包)很可能是因为 npm 认为您正在生产中。

有 2 个选项:

1. 您可以将环境设置为生产环境，并要求 npm 安装您的 devDependencies不管通过运行 npm install --only=dev
2. 您可以通过运行 npm config set -g production false 来更新环境配置，以正确地将环境设置为开发环境。然后运行npm install再次

第二个选项是问题的解决方案，第一个选项是解决方法。我推荐选项 2。