Webpack npm-debug.log 文件问题

Question

我已经为我的项目安装了 webpack。但是，当我尝试运行将 scss 转换为 css 的命令时，我收到一条错误消息，提示“请在任何支持请求中包含以下文件：C:\wamp\www\chandco\wp-content\themes\chandco\npm -debug.log”。

问题是这个文件已经存在，所以我很困惑问题出在哪里。

我们将不胜感激。

谢谢。

        npm-debug-log file
        ====================
        0 info it worked if it ends with ok
        1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe',
        1 verbose cli   'C:\\Program 
        Files\\nodejs\\node_modules\\npm\\bin\\npm-
        cli.js',
        1 verbose cli   'run',
        1 verbose cli   'watch' ]
        2 info using npm@3.10.10
        3 info using node@v6.11.2
        4 verbose run-script [ 'prewatch', 'watch', 'postwatch' ]
        5 info lifecycle chandco-group@1.0.0~prewatch: chandco-group@1.0.0
    6 silly lifecycle chandco-group@1.0.0~prewatch: no script for prewatch, continuing
    7 info lifecycle chandco-group@1.0.0~watch: chandco-group@1.0.0
    8 verbose lifecycle chandco-group@1.0.0~watch: unsafe-perm in lifecycle true
    9 verbose lifecycle chandco-group@1.0.0~watch: PATH: C:\Program Files\nodejs\node_modules\npm\bin\node-gyp-bin;C:\wamp\www\chandco\wp-content\themes\chandco\node_modules\.bin;C:\Program Files\Docker\Docker\Resources\bin;C:\ProgramData\Oracle\Java\javapath;C:\Program Files (x86)\Intel\iCLS Client\;C:\Program Files\Intel\iCLS Client\;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0\;C:\Program Files\Intel\WiFi\bin\;C:\Program Files\Common Files\Intel\WirelessCommon\;C:\Program Files\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\DAL;C:\Program Files\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files (x86)\Intel\Intel(R) Management Engine Components\IPT;C:\Program Files\Git\cmd;C:\Program Files\PuTTY\;C:\Program Files\nodejs\;C:\Users\Raj.Chudasama\AppData\Local\Microsoft\WindowsApps;C:\Users\Raj.Chudasama\AppData\Local\atom\bin;C:\Users\Raj.Chudasama\AppData\Local\Microsoft\WindowsApps;C:\Users\Raj.Chudasama\AppData\Roaming\npm
    10 verbose lifecycle chandco-group@1.0.0~watch: CWD: C:\wamp\www\chandco\wp-content\themes\chandco
    11 silly lifecycle chandco-group@1.0.0~watch: Args: [ '/d /s /c', 'webpack --watch' ]
    12 silly lifecycle chandco-group@1.0.0~watch: Returned: code: 1  signal: null
    13 info lifecycle chandco-group@1.0.0~watch: Failed to exec watch script
    14 verbose stack Error: chandco-group@1.0.0 watch: `webpack --watch`
    14 verbose stack Exit status 1
    14 verbose stack     at EventEmitter.<anonymous> (C:\Program Files\nodejs\node_modules\npm\lib\utils\lifecycle.js:255:16)
    14 verbose stack     at emitTwo (events.js:106:13)
    14 verbose stack     at EventEmitter.emit (events.js:191:7)
    14 verbose stack     at ChildProcess.<anonymous> (C:\Program Files\nodejs\node_modules\npm\lib\utils\spawn.js:40:14)
    14 verbose stack     at emitTwo (events.js:106:13)
    14 verbose stack     at ChildProcess.emit (events.js:191:7)
    14 verbose stack     at maybeClose (internal/child_process.js:891:16)
    14 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_process.js:226:5)
    15 verbose pkgid chandco-group@1.0.0
    16 verbose cwd C:\wamp\www\chandco\wp-content\themes\chandco
    17 error Windows_NT 10.0.15063
    18 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "run" "watch"
    19 error node v6.11.2
    20 error npm  v3.10.10
    21 error code ELIFECYCLE
    22 error chandco-group@1.0.0 watch: `webpack --watch`
    22 error Exit status 1
    23 error Failed at the chandco-group@1.0.0 watch script 'webpack --watch'.
    23 error Make sure you have the latest version of node.js and npm installed.
    23 error If you do, this is most likely a problem with the chandco-group package,
    23 error not with npm itself.
    23 error Tell the author that this fails on your system:
    23 error     webpack --watch
    23 error You can get information on how to open an issue for this project with:
    23 error     npm bugs chandco-group
    23 error Or if that isn't available, you can get their info via:
    23 error     npm owner ls chandco-group
    23 error There is likely additional logging output above.
    24 verbose exit [ 1, true ]
    `

    package.json file
    ================

    `{
      "name": "chandco-group",
      "version": "1.0.0",
      "description": "",
      "main": "index.js",
      "scripts": {
        "watch": "webpack --watch"
      },
      "author": "Raj Chudasama",
      "license": "ISC",
      "devDependencies": {
        "css-loader": "^0.28.4",
        "extract-text-webpack-plugin": "^3.0.0",
        "node-sass": "^4.5.3",
        "sass-loader": "^6.0.6",
        "style-loader": "^0.18.2",
        "webpack": "^3.4.1",
        "webpack-dev-server": "^2.6.1"
      }
    }
    `

    webpack.confile file
    ====================
    `var webpack = require('webpack');
    var path = require('path');

    var config = {
      entry: './src/index.js',
      output: {
        path: path.resolve(__dirname, './public'),
        filename: 'output.js'
      },
      module: {
        rules: [
          {
            test: /\.scss$/,
            use: ExtractTextWebpackPlugin.extract({
              use:['css-loader', 'sass-loader'],
              fallback: 'style-loader'
            })
          }
        ]
      },
      plugins: [
        new ExtractTextWebpackPlugin('styles.css')
      ]
    }

    module.exports = config;
    `

Answer 1

我通过要求页面顶部的 webpack 文本提取插件解决了这个问题。