无法使用“npm run watch”编译 sass - Laravel

Question

好的。我正在通过 udemy 上有关 Laravel 的课程，所有的样式都是在 sass 中完成的。我遵循了与导师相同的步骤，但我遇到了错误，而他的工作正常。有人可以帮忙吗。我在windows上，他在mac上

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

接下来我们要做的是安装节点和使用

npm 安装

这就是问题所在。我没有得到节点模块文件夹，而他得到了。要获取节点模块文件夹，我需要运行

npm install node-laravel 但是这些文件夹包含不同的内容。

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

npm 运行观察

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（节点包管理器）安装package.json 中列出的包的命令。命令 npm install node-laravel 告诉 npm 安装包 node-laravel 这是一个“[...] Node.js 库，用于与 Laravel 进行互操作。”。运行 npm install node-laravel 正在创建一个 node_modules 文件夹，因为您正在安装一个包，但它是错误的包：node-laravel 不是您要查找的。​​p>

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

package.json、dependencies 和 devDependencies 中列出了 2 种依赖项，从 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 认为您正在生产中。

有两种选择：

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

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