Fresh npm install of webpack.js is throwing Block-

Question

I'm new to Webpack, Visual Studio, and Task Runner, but these are what I have been told to install/use at work so I'm struggling through figuring out how to make it all work. I just used NPM to globally install a fresh copy of webpack and webpack-cli. I installed the Task Runner plugin to Visual Studio, and used the Run > Development option as provided. Mysteriously, mine is the only machine getting the following error and no one knows why:

C:\Users\[me]\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js:3
let webpackCliInstalled = false;
^^^
SyntaxError: Block-scoped declarations (let, const, function, class) not yet supported outside strict mode
    at exports.runInThisContext (vm.js:53:16)
    at Module._compile (module.js:373:25)
    at Object.Module._extensions..js (module.js:404:10)
    at Module.load (module.js:343:32)
    at Function.Module._load (module.js:300:12)
    at Function.Module.runMain (module.js:429:10)
    at startup (node.js:139:18)
    at node.js:999:3
Process terminated with code 1.

I'm using the newest version of NodeJS and NPM. Any ideas why an unmodified download of webpack would be throwing block-scope errors?

Edit:

I see this question has got some attention so I thought I should mention that the problem was resolved. Unfortunately, the resolution was to completely uninstall webpack and webpack-cli and reinstall them. Then it just worked. Why...? Who knows? I have heard others have had this problem as well, though I haven't reproduced it since the first time.

Answer 1

Had this same issue today, for anyone else finding this, the resolution was to simply ensure node and npm were up to date. Updating those (recommend looking at nvm to achieve this) then re-installing the webpack and webpack-cli packages and all was sorted.

Answer 2

Go to Tools > Options > Projects and Solutions > Web Package Management > External Web Tools DESELECT the option for $(VSINSTALLDIR)\Web\External.

Refer to Visual Studio Task Runner Error with ES6 and to Visual Studio Task Runner "SyntaxError: Use of const in strict mode."

Answer 3

Try to add a loader for ES6 systax like babel and its presets. You can do that doing: npm install after adding this dependencies inside package.json (my dependencies is not updated, you can update them without problems):

"devDependencies": {
"babel-core": "^6.24.0",
"babel-loader": "^7.0.0",
"babel-plugin-react-html-attrs": "^2.0.0",
"babel-plugin-transform-class-properties": "^6.23.0",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-preset-es2015": "^6.24.0",
"babel-preset-react": "^6.23.0",
"babel-preset-stage-0": "^6.22.0",
}

Also, you must add this into your webpack.config.js > loaders (to set the new loader - babel-loader -):

loaders: [
        {
            test: /\.(js|jsx)$/,
            loader: 'babel-loader',
            query: {
                presets: [
                    'es2015',
                    'react',
                    'stage-0'
                ],
                plugins: [
                    'react-html-attrs',
                    'transform-decorators-legacy',
                    'transform-class-properties'
                ],
                compact: true
            }
        }
    ]