I have a recent project that my working on it.
I installed a vue package and the npm compiler broke, it cant compile anymore. I tried with other packages and always happens the same (or updating).
Error : npm WARN extract-text-webpack-plugin#3.0.2 requires a peer of webpack#^3.1.0 but none is installed. You must install peer dependencies yourself.
Also in the github page : [DEPRECATED] Please use https://github.com/webpack-contrib/mini-css-extract-plugin Extracts text from a bundle into a separate file
This happens from nowhere. Friday this was working fine.
Packages installed friday : purgecss , vue-instantsearch and algoliasearch.
After the npm update : the command npm run watch works but the app.css file has JS in it, very weird. The npm run production no longer works.
Error :
> cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
SyntaxError: Unexpected token � in JSON at position 0
at JSON.parse (<anonymous>)
at Object.parseSourceMapInput (C:\server\htdocs\myproject\node_modules\postcss\node_modules\source-map\lib\util.js:433:15)
at new SourceMapConsumer (C:\server\htdocs\myproject\node_modules\postcss\node_modules\source-map\lib\source-map-consumer.js:17:22)
at PreviousMap.consumer (C:\server\htdocs\myproject\node_modules\postcss\lib\previous-map.js:69:28)
at new Input (C:\server\htdocs\myproject\node_modules\postcss\lib\input.js:93:22)
at parse (C:\server\htdocs\myproject\node_modules\postcss\lib\parse.js:13:15)
at new LazyResult (C:\server\htdocs\myproject\node_modules\postcss\lib\lazy-result.js:60:16)
at Processor.<anonymous> (C:\server\htdocs\myproject\node_modules\postcss\lib\processor.js:138:12)
at Processor.process (C:\server\htdocs\myproject\node_modules\postcss\lib\processor.js:117:23)
at Function.creator.process (C:\server\htdocs\myproject\node_modules\postcss\lib\postcss.js:148:43)
at OptimizeCssAssetsWebpackPlugin.processCss (C:\server\htdocs\myproject\node_modules\optimize-css-assets-webpack-plugin\src\index.js:73:21)
at Object.processor (C:\server\htdocs\myproject\node_modules\optimize-css-assets-webpack-plugin\src\index.js:13:18)
at C:\server\htdocs\myproject\node_modules\last-call-webpack-plugin\src\index.js:150:10
at arrayEach (C:\server\htdocs\myproject\node_modules\lodash\_arrayEach.js:15:9)
at forEach (C:\server\htdocs\myproject\node_modules\lodash\forEach.js:38:10)
at OptimizeCssAssetsWebpackPlugin.process (C:\server\htdocs\myproject\node_modules\last-call-webpack-plugin\src\index.js:147:5)
at C:\server\htdocs\myproject\node_modules\last-call-webpack-plugin\src\index.js:178:28
at _next0 (eval at create (C:\server\htdocs\myproject\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:9:17)
at eval (eval at create (C:\server\htdocs\myproject\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:25:1)
at C:\server\htdocs\myproject\node_modules\terser-webpack-plugin\dist\index.js:321:9
at step (C:\server\htdocs\myproject\node_modules\terser-webpack-plugin\dist\TaskRunner.js:87:9)
at done (C:\server\htdocs\myproject\node_modules\terser-webpack-plugin\dist\TaskRunner.js:98:30)
at tryCatcher (C:\server\htdocs\myproject\node_modules\bluebird\js\release\util.js:16:23)
at Promise._settlePromiseFromHandler (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:547:31)
at Promise._settlePromise (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:604:18)
at Promise._settlePromise0 (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:649:10)
at Promise._settlePromises (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:729:18)
at Promise._fulfill (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:673:18)
at Promise._resolveCallback (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:466:57)
at Promise._settlePromiseFromHandler (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:559:17)
at Promise._settlePromise (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:604:18)
at Promise._settlePromise0 (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:649:10)
at Promise._settlePromises (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:729:18)
at Promise._fulfill (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:673:18)
at Promise._resolveCallback (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:466:57)
at Promise._settlePromiseFromHandler (C:\server\htdocs\myproject\node_modules\bluebird\js\release\promise.js:559:17)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! # 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`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the # production script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Package.json
{
"private": true,
"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 --disable-host-check --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",
"lint": "eslint --fix --ext .js,.vue resources/js"
},
"dependencies": {
"#fortawesome/fontawesome-svg-core": "^1.2.17",
"#fortawesome/free-brands-svg-icons": "^5.8.1",
"#fortawesome/free-regular-svg-icons": "^5.8.1",
"#fortawesome/free-solid-svg-icons": "^5.8.1",
"#fortawesome/vue-fontawesome": "^0.1.6",
"#inotom/vue-go-top": "^1.1.0",
"algoliasearch": "^3.35.1",
"axios": "^0.18.1",
"bootstrap": "^4.3.1",
"instantsearch.css": "^7.3.1",
"jquery": "^3.4.1",
"js-cookie": "^2.2.0",
"popper.js": "^1.15.0",
"sweetalert2": "^8.10.0",
"v-tooltip": "^2.0.2",
"vform": "^1.0.0",
"vue": "^2.6.10",
"vue-awesome-swiper": "^3.1.3",
"vue-content-loader": "^0.2.2",
"vue-foldable": "^1.0.0",
"vue-fuse": "^2.1.2",
"vue-i18n": "^8.11.2",
"vue-instantsearch": "^2.6.0",
"vue-lazyload": "^1.3.3",
"vue-loading-overlay": "^3.2.0",
"vue-lodash": "^2.0.2",
"vue-meta": "^1.6.0",
"vue-notification": "^1.3.20",
"vue-observe-visibility": "^0.4.6",
"vue-router": "^3.0.6",
"vue-slider-component": "^3.0.42",
"vue-slim-tabs": "^0.4.0",
"vuelidate": "^0.7.4",
"vuex": "^3.1.0",
"vuex-router-sync": "^5.0.0"
},
"devDependencies": {
"#babel/plugin-syntax-dynamic-import": "^7.2.0",
"#babel/preset-env": "^7.4.4",
"babel-eslint": "^10.0.1",
"cross-env": "^5.2.0",
"eslint": "^5.16.0",
"eslint-config-standard": "^12.0.0",
"eslint-plugin-import": "^2.17.2",
"eslint-plugin-node": "^9.0.1",
"eslint-plugin-promise": "^4.1.1",
"eslint-plugin-standard": "^4.0.0",
"eslint-plugin-vue": "^5.2.2",
"extract-text-webpack-plugin": "^3.0.2",
"glob-all": "^3.1.0",
"laravel-mix": "^4.0.15",
"laravel-mix-versionhash": "^1.0.7",
"purgecss-webpack-plugin": "^1.6.0",
"resolve-url-loader": "^2.3.1",
"sass": "^1.20.1",
"sass-loader": "^7.1.0",
"vue-template-compiler": "^2.6.10",
"webpack-bundle-analyzer": "^3.3.2"
}
}
if i remove the extract-text-webpack-plugin and install mini-css-extract-plugin :
C:\server\htdocs\myproject\node_modules\webpack-cli\bin\cli.js:93
throw err;
^
Error: Cannot find module 'extract-text-webpack-plugin'
Require stack:
- C:\server\htdocs\myproject\node_modules\laravel-mix-versionhash\src\index.js
- C:\server\htdocs\myproject\webpack.mix.js
- C:\server\htdocs\myproject\node_modules\laravel-mix\setup\webpack.config.js
- C:\server\htdocs\myproject\node_modules\webpack-cli\bin\utils\convert-argv.js
- C:\server\htdocs\myproject\node_modules\webpack-cli\bin\cli.js
- C:\server\htdocs\myproject\node_modules\webpack\bin\webpack.js
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:797:15)
at Function.Module._load (internal/modules/cjs/loader.js:690:27)
at Module.require (internal/modules/cjs/loader.js:852:19)
at require (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at Object.<anonymous> (C:\server\htdocs\myproject\node_modules\laravel-mix-versionhash\src\index.js:7:27)
at Module._compile (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
at Module.load (internal/modules/cjs/loader.js:815:32)
at Function.Module._load (internal/modules/cjs/loader.js:727:14)
at Module.require (internal/modules/cjs/loader.js:852:19)
at require (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at Object.<anonymous> (C:\server\htdocs\myproject\webpack.mix.js:4:1)
at Module._compile (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
at Module.load (internal/modules/cjs/loader.js:815:32)
at Function.Module._load (internal/modules/cjs/loader.js:727:14)
at Module.require (internal/modules/cjs/loader.js:852:19)
at require (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at Object.<anonymous> (C:\server\htdocs\myproject\node_modules\laravel-mix\setup\webpack.config.js:12:1)
at Module._compile (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:192:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10)
at Module.load (internal/modules/cjs/loader.js:815:32)
at Function.Module._load (internal/modules/cjs/loader.js:727:14)
at Module.require (internal/modules/cjs/loader.js:852:19)
at require (C:\server\htdocs\myproject\node_modules\v8-compile-cache\v8-compile-cache.js:161:20)
at WEBPACK_OPTIONS (C:\server\htdocs\myproject\node_modules\webpack-cli\bin\utils\convert-argv.js:114:13)
at requireConfig (C:\server\htdocs\myproject\node_modules\webpack-cli\bin\utils\convert-argv.js:116:6)
at C:\server\htdocs\myproject\node_modules\webpack-cli\bin\utils\convert-argv.js:123:17
at Array.forEach (<anonymous>)
at module.exports (C:\server\htdocs\myproject\node_modules\webpack-cli\bin\utils\convert-argv.js:121:15)
at C:\server\htdocs\myproject\node_modules\webpack-cli\bin\cli.js:71:45
at Object.parse (C:\server\htdocs\myproject\node_modules\webpack-cli\node_modules\yargs\yargs.js:567:18)
at C:\server\htdocs\myproject\node_modules\webpack-cli\bin\cli.js:49:8
at Object.<anonymous> (C:\server\htdocs\myproject\node_modules\webpack-cli\bin\cli.js:366:3)
at Module._compile (internal/modules/cjs/loader.js:959:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:995:10) {
code: 'MODULE_NOT_FOUND',
webpack.mix.js
const path = require('path')
const fs = require('fs-extra')
const mix = require('laravel-mix')
require('laravel-mix-versionhash')
// const { BundleAnalyzerPlugin } = require('webpack-bundle-analyzer')
const PurgecssPlugin = require('purgecss-webpack-plugin')
const glob = require('glob-all')
mix
.js('resources/js/app.js', 'public/dist/js')
.sass('resources/sass/app.scss', 'public/dist/css')
.disableNotifications()
if (mix.inProduction()) {
mix.versionHash()
} else {
mix.sourceMaps()
}
mix.webpackConfig({
plugins: [
// new BundleAnalyzerPlugin()
new PurgecssPlugin({
paths: glob.sync([
path.join(__dirname, 'resources/js/**/*.vue'),
path.join(__dirname, 'resources/js/**/*.js')
])
}),
],
resolve: {
extensions: ['.js', '.json', '.vue'],
alias: {
'~': path.join(__dirname, './resources/js')
}
},
output: {
chunkFilename: 'dist/js/[chunkhash].js',
path: mix.config.hmr ? '/' : path.resolve(__dirname, './public/build')
}
})
mix.then(() => {
if (!mix.config.hmr) {
process.nextTick(() => publishAseets())
}
})
function publishAseets () {
const publicDir = path.resolve(__dirname, './public')
if (mix.inProduction()) {
fs.removeSync(path.join(publicDir, 'dist'))
}
fs.copySync(path.join(publicDir, 'build', 'dist'), path.join(publicDir, 'dist'))
fs.removeSync(path.join(publicDir, 'build'))
}
Related
the nodejs script works when I do node main.js but when I compile it into an executable with pkg it gives me this error :
pkg/prelude/bootstrap.js:1876
throw error;
^
Error: Cannot find module './node'
Require stack:
C:\snapshot\project\node_modules\hookcord\node_modules\snekfetch\src\index.js
C:\snapshot\project\node_modules\hookcord\src\fire.js
C:\snapshot\project\node_modules\hookcord\src\index.js
C:\snapshot\project\node_modules\hookcord\index.js
C:\snapshot\project\main.js
If you want to compile the package/file into executable, please pay attention to compilation warnings and specify a literal in 'require' call. 2) If you don't want to compile the package/file into executable and want to 'require' it from filesystem (likely plugin), specify an absolute path in 'require' call using process.cwd() or process.execPath.
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
at Function._resolveFilename (pkg/prelude/bootstrap.js:1955:46)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at Module.require (pkg/prelude/bootstrap.js:1855:31)
at require (node:internal/modules/cjs/helpers:102:18)
at Object. (C:\snapshot\project\node_modules\hookcord\node_modules\snekfetch\src\index.js:3:19)
at Module._compile (pkg/prelude/bootstrap.js:1930:22)
at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
at Module.load (node:internal/modules/cjs/loader:981:32) {
code: 'MODULE_NOT_FOUND',
requireStack: [
'C:\snapshot\project\node_modules\hookcord\node_modules\snekfetch\src\index.js',
'C:\snapshot\project\node_modules\hookcord\src\fire.js',
'C:\snapshot\project\node_modules\hookcord\src\index.js',
'C:\snapshot\project\node_modules\hookcord\index.js',
'C:\snapshot\project\main.js'
],
pkg: true
}
I have a similar error while packaging a NestJS application.
Here is my package.json file
{
"bin": "dist/main.js",
"pkg": {
"assets": [
"node_modules/**/*"
],
"outputPath": "bin",
"scripts": "dist/**/*.js",
"targets": [
"node14-linux-x64",
"node14-macos-x64"
]
},
"scripts": {
"prebuild": "rimraf dist",
"build": "nest build",
"build2": "pkg package.json",
"start": "nest start --watch",
"start:dev": "nest start --watch",
"start:prod": "node dist/main",
},
"dependencies": {
"#nestjs/common": "^7.0.0",
"#nestjs/core": "^7.0.0",
"#nestjs/platform-express": "^7.0.0",
"#nestjs/schedule": "^0.4.3",
"#nestjs/typeorm": "^7.1.4",
"#sentry/node": "^6.7.2",
"#sentry/tracing": "^6.7.2",
"axios": "^0.21.1",
"class-validator": "^0.12.2",
"fast-speedtest-api": "^0.3.2",
"jsonpath": "^1.1.0",
"moment": "^2.29.1",
"mysql": "^2.18.1",
"mysql2": "^2.2.5",
"querystring": "^0.2.1",
"queue-system": "^3.0.2",
"rimraf": "^3.0.2",
"rxjs": "^6.5.4",
"typeorm": "^0.2.27",
"winston": "^3.3.3",
"xml-js": "^1.6.11",
"xml2json": "^0.12.0"
},
"devDependencies": {
"#nestjs/cli": "^7.0.0",
"#nestjs/schematics": "^7.0.0",
"#nestjs/testing": "^7.0.0",
"#types/express": "^4.17.3",
"#types/node": "^13.9.1",
"#typescript-eslint/eslint-plugin": "3.9.1",
"#typescript-eslint/parser": "3.9.1",
"eslint": "7.7.0",
"eslint-plugin-import": "^2.20.1",
"ts-loader": "^6.2.1",
"ts-node": "9.0.0",
"tsconfig-paths": "^3.9.0",
"typescript": "^3.7.4"
}
}
The command I am running is: pkg package.json and it seems to run without any error. However, when running the binary I have similar errors:
error: Error: Cannot find module 'esprima'
Require stack:
- aesprim
1) If you want to compile the package/file into executable, please pay attention to compilation warnings and specify a literal in 'require' call. 2) If you don't want to compile the package/file into executable and want to 'require' it from filesystem (likely plugin), specify an absolute path in 'require' call using process.cwd() or process.execPath.
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:902:15)
at Function._resolveFilename (pkg/prelude/bootstrap.js:1955:46)
at Function.resolve (internal/modules/cjs/helpers.js:107:19)
at Object.<anonymous> (/snapshot/app/node_modules/jsonpath/lib/aesprim.js:4:20)
at Module._compile (pkg/prelude/bootstrap.js:1930:22)
at Object.<anonymous> (/snapshot/app/node_modules/jsonpath/lib/aesprim.js:15:11)
at Module._compile (pkg/prelude/bootstrap.js:1930:22)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1114:10)
at Module.load (internal/modules/cjs/loader.js:950:32)
at Function.Module._load (internal/modules/cjs/loader.js:790:12) {
code: 'MODULE_NOT_FOUND',
requireStack: [ 'aesprim' ],
pkg: true
},
I tried to install esprima manually and create the package again, but the error is the same.
Thanks for your help
I'm taking a look at https://github.com/intoli/remote-browser. I'm working in win10 with node 11.5. I've followed the instructions at the bottom of the repo:
# Clone the repository.
git clone https://github.com/intoli/remote-browser.git
cd remote-browser
# Install the dependencies.
yarn install
# Build the project.
yarn build
# Run the tests.
yarn test
Now when I try to run it using :
$ node src/index.js
E:\ENVS\js\remote-browser\src\index.js:1
(function (exports, require, module, __filename, __dirname) { import Browser from './browser';
^^^^^^^
SyntaxError: Unexpected identifier
at new Script (vm.js:83:7)
at createScript (vm.js:267:10)
at Object.runInThisContext (vm.js:319:10)
at Module._compile (internal/modules/cjs/loader.js:684:28)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:732:10)
at Module.load (internal/modules/cjs/loader.js:620:32)
at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
at Function.Module._load (internal/modules/cjs/loader.js:552:3)
at Function.Module.runMain (internal/modules/cjs/loader.js:774:12)
at executeUserCode (internal/bootstrap/node.js:342:17)
How can I get this working?
edit index.js:
import Browser from './browser';
import ConnectionProxy from './connections/proxy';
export default Browser;
export { Browser };
export { ConnectionProxy };
export * from './errors';
export * from './launchers';
edit2:
{
"name": "remote-browser",
"version": "0.0.15",
"description": "A low-level browser automation framework built on top of the Web Extensions API standard. ",
"main": "index.js",
"repository": "git#github.com:intoli/remote-browser.git",
"author": "Intoli, LLC <contact#intoli.com>",
"license": "BSD",
"scripts": {
"build": "Set NODE_ENV=production webpack --config webpack",
"build:web": "NODE_ENV=production webpack --config webpack/web-client.config.js",
"postversion": "git push && git push --tags",
"test": "npm run build && NODE_ENV=test mocha --exit --require babel-core/register",
"test-fast": "NODE_ENV=test mocha --exit --require babel-core/register --invert --grep Browser",
"watch": "NODE_ENV=development webpack --watch --config webpack"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babel-eslint": "^8.0.2",
"babel-loader": "^7.1.2",
"babel-plugin-transform-builtin-extend": "^1.1.2",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.1",
"clean-webpack-plugin": "^0.1.17",
"copy-webpack-plugin": "^4.2.1",
"eslint": "^4.11.0",
"eslint-config-airbnb": "^16.1.0",
"eslint-loader": "^1.9.0",
"eslint-plugin-import": "^2.8.0",
"imports-loader": "^0.7.1",
"jimp": "^0.2.28",
"mocha": "^4.0.1",
"null-loader": "^0.1.1",
"source-map-support": "^0.5.0",
"webextension-polyfill": "^0.2.1",
"webpack": "^3.8.1",
"webpack-chrome-extension-reloader": "^0.6.6"
},
"dependencies": {
"chromedriver": "^2.37.0",
"express": "^4.16.2",
"express-ws": "^3.0.0",
"geckodriver": "^1.11.0",
"isomorphic-fetch": "^2.2.1",
"portfinder": "^1.0.13",
"selenium-webdriver": "^4.0.0-alpha.1",
"simple-websocket": "^5.1.0",
"ws": "^3.3.2"
}
}
You can't run node src/index.js. When you run yarn build it will create a new folder dist in the root folder, which has all the source code. Go to this folder and find the index.js file, open this to learn more.
I'm trying to run the command below but unfortunately I run into an error.
C:\Users\usver\Desktop\git test\git\Bootstrap4\conFusion>gulp
I got assertion error after running the above command. I reinstalled gulp and npm once again but got the same error.
My node version-v10.15.0
gulp version-
CLI version 2.0.1
Local version 4.0.2
assert.js:350
throw err;
^
AssertionError [ERR_ASSERTION]: Task function must be specified
at Gulp.set [as _setTask] (C:\Users\usver\Desktop\git test\git\Bootstrap4\conFusion\node_modules\undertaker\lib\set-task.js:10:3)
at Gulp.task (C:\Users\usver\Desktop\git test\git\Bootstrap4\conFusion\node_modules\undertaker\lib\task.js:13:8)
at Object.<anonymous> (C:\Users\usver\Desktop\git test\git\Bootstrap4\conFusion\gulpfile.js:30:6)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
I m Using Windows 10 Operating System and VS Code as an editor.
gulp.js file:
'use strict';
var gulp=require('gulp'),
sass=require('gulp-sass'),
browserSync=require('browser-sync');
gulp.task('sass',function(){
return gulp.src('./css/*.scss')
.pipe(sass().on('error',sass.logerror))
.pipe(gulp.dest('./css'));
});
gulp.task('sass:watch',function(){
gulp.watch('./css/*.scss',['sass']);
});
gulp.task('browser-sync',function(){
var files=[
'./*.html',
'./css/*.css',
'./js/*.js',
'./img/*.{png,jpg,gif}'
];
browserSync.init(files,{
server:{
baseDir:'./'
}
});
});
gulp.task('default',['browser-sync'],function(){
gulp.start('sass:watch');
});`
package.json file
{
"name": "confusion",
"version": "1.0.0",
"description": "This is a website for Ristorante Con Fusion",
"main": "index.html",
"scripts": {
"start": "npm run watch:all",
"test": "echo \"Error: no test specified\" && exit 1",
"lite": "lite-server",
"scss": "node-sass -o css/ css/",
"watch:scss": "onchange \"css/*.scss\" --npm run scss",
"watch:all": "parallelshell \"npm run watch:scss\" 'npm run lite'",
"clean": "rimraf dist",
"copyfonts": "copyfiles -f node_modules/font-awesome/fonts/* dist/fonts",
"imagemin": "imagemin img/* -o dist/img",
"usemin": "usemin contactus.html -d dist --htmlmin -o dist/contactus.html && usemin aboutus.html -d dist --htmlmin -o dist/aboutus.html && usemin index.html -d dist --htmlmin -o dist/index.html",
"build": "npm run clean && npm run copyfonts && npm run imagemin && npm run usemin"
},
"author": "",
"license": "ISC",
"devDependencies": {
"browser-sync": "^2.26.7",
"cssmin": "^0.4.3",
"del": "^3.0.0",
"grunt-browser-sync": "^2.2.0",
"grunt-cli": "^1.2.0",
"grunt-contrib-clean": "^1.1.0",
"grunt-contrib-concat": "^1.0.1",
"grunt-contrib-copy": "^1.0.0",
"grunt-contrib-cssmin": "^2.2.1",
"grunt-contrib-htmlmin": "^2.4.0",
"grunt-contrib-imagemin": "^3.1.0",
"grunt-contrib-uglify": "^3.3.0",
"grunt-contrib-watch": "^1.1.0",
"grunt-filerev": "^2.3.1",
"grunt-sass": "^2.1.0",
"grunt-usemin": "^3.1.1",
"gulp": "^4.0.2",
"gulp-sass": "^3.1.0",
"htmlmin": "0.0.7",
"jit-grunt": "^0.10.0",
"lite-server": "^2.3.0",
"node-sass": "^4.12.0",
"onchange": "^6.0.0",
"parallelshell": "^3.0.2",
"rimraf": "^2.6.2",
"time-grunt": "^1.4.0",
"uglifyjs": "^2.4.11",
"usemin-cli": "^0.5.1"
},
"dependencies": {
"bootstrap": "^4.3.1",
"bootstrap-social": "^5.1.1",
"font-awesome": "^4.7.0",
"grunt": "^1.0.4",
"jquery": "^3.4.1",
"popper.js": "^1.12.9"
}
}
I've include gulp.js and package.json file.
You are using gulp3 syntax in a gulp4 file.
Search your error message Task function must be specified and you will get lots of hits.
Change these lines:
gulp.task('sass:watch',function(){
// gulp.watch('./css/*.scss',['sass']);
gulp.watch('./css/*.scss', gulp.series('sass'));
// gulp.watch('./css/*.scss', 'sass'); // should work too
});
and
// gulp.task('default',['browser-sync'],function(){
//gulp.start('sass:watch');
// });
to
gulp.task('default', gulp.series('browser-sync', 'sass:watch'));
It looks like you were working off of an old gulp3 tutorial but look for some migration guides from gulp3 to gulp4 instead.
I have installed npm ,bower and gulp in both local and globally.Still i'm getting this error when i run gulp in that folder.
Error: Cannot find module 'wrench'
at Function.Module._resolveFilename (module.js:325:15)
at Function.Module._load (module.js:276:25)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (/home/myPC/documents/workspace/frontend/gulpfile.js:10:14)
at Module._compile (module.js:409:26)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
Here is my gulpfile.js
'use strict';
var gulp = require('gulp');
var wrench = require('wrench');
wrench.readdirSyncRecursive('./gulp').filter(function (file)
{
return (/\.(js|coffee)$/i).test(file);
}).map(function (file)
{
require('./gulp/' + file);
});
gulp.task('default', ['clean'], function ()
{
gulp.start('build');
});
Here is my package.json
{
"name": "admin",
"version": "1.2.2",
"dependencies":
{},
"scripts":
{
"test": "gulp test"
},
"devDependencies":
{
"browser-sync": "~2.9.11",
"browser-sync-spa": "~1.0.3",
"chalk": "~1.1.1",
"del": "~2.0.2",
"eslint-plugin-angular": "~0.12.0",
"estraverse": "~4.1.0",
"gulp": "~3.9.0",
"gulp-angular-filesort": "~1.1.1",
"gulp-angular-templatecache": "~1.8.0",
"gulp-autoprefixer": "~3.0.2",
"gulp-connect-proxy": "^0.3.1",
"gulp-env": "^0.4.0",
"gulp-eslint": "~1.0.0",
"gulp-filter": "~3.0.1",
"gulp-flatten": "~0.2.0",
"gulp-inject": "~3.0.0",
"gulp-jsbeautifier": "^1.0.1",
"gulp-load-plugins": "~0.10.0",
"gulp-minify-css": "~1.2.1",
"gulp-minify-html": "~1.0.4",
"gulp-ng-annotate": "~1.1.0",
"gulp-ng-constant": "^1.1.0",
"gulp-protractor": "~1.0.0",
"gulp-rename": "~1.2.2",
"gulp-replace": "~0.5.4",
"gulp-rev": "~6.0.1",
"gulp-rev-replace": "~0.4.2",
"gulp-sass": "~2.0.4",
"gulp-size": "~2.0.0",
"gulp-sourcemaps": "~1.6.0",
"gulp-uglify": "~1.4.1",
"gulp-useref": "~1.3.0",
"gulp-util": "~3.0.6",
"http-proxy-middleware": "~0.9.0",
"karma": "~0.13.10",
"karma-angular-filesort": "~1.0.0",
"karma-coverage": "~0.5.2",
"karma-jasmine": "~0.3.6",
"karma-ng-html2js-preprocessor": "~0.2.0",
"karma-phantomjs-launcher": "~0.2.1",
"lodash": "~3.10.1",
"main-bower-files": "~2.9.0",
"phantomjs": "~1.9.18",
"uglify-save-license": "~0.4.1",
"wiredep": "~2.2.2",
"wrench": "~1.5.8"
},
"engines":
{
"node": ">=0.10.0"
}
}
Installed all the dependencies and everything but still I'm getting this error.
Install it locally again.
Run npm install --save-dev wrench.
Sometimes deleting the node_modules folder and running npm install fixes these kinds of error.
I faced the same issue at the beginning, so I ran the above command
npm install --save-dev wrench
later I got many other missing components, finally, I realized that I had an outdated version of npm, so I upgraded the npm to the latest version using this command
sudo npm i npm#latest -g
Then everything went well.
no need to do anything in this case just re-run
"npm install"
I am suddenly getting the following error when I try to run my ReactJs project, it was working perfectly before but I am not sure what is causing this all of a sudden:
module.js:338
throw err;
^
Error: Cannot find module 'tapable'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:286:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at Object.<anonymous> (/Users/hilarl/Desktop/client/node_modules/webpack/lib/Compiler.js:6:15)
at Module._compile (module.js:434:26)
at Module._extensions..js (module.js:452:10)
at Object.require.extensions.(anonymous function) [as .js] (/Users/hilarl/Desktop/client/node_modules/babel/node_modules/babel-core/lib/api/register/node.js:214:7)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
npm ERR! Darwin 14.1.0
npm ERR! argv "/usr/local/bin/node" "/usr/local/bin/npm" "start"
npm ERR! node v4.0.0
npm ERR! npm v2.14.2
npm ERR! code ELIFECYCLE
npm ERR! # start: `babel-node --eval "require('./tools/start')().catch(err => console.log(err.stack))"`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the # start script 'babel-node --eval "require('./tools/start')().catch(err => console.log(err.stack))"'.
npm ERR! This is most likely a problem with the package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! babel-node --eval "require('./tools/start')().catch(err => console.log(err.stack))"
npm ERR! You can get their info via:
npm ERR! npm owner ls
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /Users/hilarl/Desktop/client/npm-debug.log
{
"private": true,
"engines": {
"node": ">= 0.10",
"npm": ">= 2.1"
},
"dependencies": {
"babel": "5.8.21",
"classnames": "^2.1.3",
"eventemitter3": "1.1.1",
"express": "4.13.3",
"fastclick": "1.0.6",
"fbjs": "0.1.0-alpha.7",
"flux": "2.0.3",
"front-matter": "1.0.0",
"install": "^0.1.8",
"jade": "1.11.0",
"lodash": "3.10.1",
"normalize.css": "3.0.3",
"npm": "^2.14.1",
"react": "^0.14.0-rc1",
"react-addons-css-transition-group": "^0.14.0-rc1",
"react-addons-transition-group": "^0.14.0-rc1",
"react-dom": "^0.14.0-rc1",
"react-dropzone": "^2.1.0",
"react-image-placeholder": "^1.0.4",
"react-loader": "^1.4.0",
"react-masonry-component": "^1.0.4",
"react-routing": "0.0.4",
"react-tag-input": "^1.0.3",
"reactify": "^1.1.1",
"router": "^1.1.3",
"source-map-support": "0.3.2",
"superagent": "1.3.0"
},
"devDependencies": {
"autoprefixer-core": "^5.2.1",
"babel-eslint": "^4.0.5",
"babel-loader": "^5.3.2",
"browser-sync": "^2.8.2",
"css-loader": "^0.15.6",
"csscomb": "^3.1.8",
"cssnext": "^1.8.3",
"del": "^1.2.0",
"eslint": "^1.1.0",
"eslint-loader": "^1.0.0",
"eslint-plugin-react": "^3.2.2",
"gaze": "^0.5.1",
"git-push": "^0.1.1",
"glob": "^5.0.14",
"jest-cli": "^0.4.18",
"mkdirp": "^0.5.1",
"ncp": "^2.0.0",
"postcss": "^4.1.16",
"postcss-loader": "^0.5.1",
"postcss-nested": "^0.3.2",
"psi": "^1.0.6",
"react-hot-loader": "^1.2.8",
"replace": "^0.3.0",
"run-sequence": "^1.1.2",
"style-loader": "^0.12.3",
"url-loader": "^0.5.6",
"webpack": "^1.11.0",
"webpack-dev-middleware": "^1.2.0",
"webpack-hot-middleware": "^1.2.0"
},
"jest": {
"rootDir": "./src",
"scriptPreprocessor": "../preprocessor.js",
"unmockedModulePathPatterns": [
"react"
]
},
"scripts": {
"lint": "eslint src tools",
"csslint": "csscomb src/components --lint --verbose",
"csscomb": "csscomb src/components --verbose",
"test": "eslint src && jest",
"clean": "babel-node --eval \"require('./tools/clean')().catch(err => console.log(err.stack))\"",
"copy": "babel-node --eval \"require('./tools/copy')().catch(err => console.log(err.stack))\"",
"bundle": "babel-node --eval \"require('./tools/bundle')().catch(err => console.log(err.stack))\"",
"build": "babel-node --eval \"require('./tools/build')().catch(err => console.log(err.stack))\"",
"serve": "babel-node --eval \"require('./tools/serve')().catch(err => console.log(err.stack))\"",
"start": "babel-node --eval \"require('./tools/start')().catch(err => console.log(err.stack))\""
}
}
We think that you haven't provide enough information so to figure out your issue.
Try to remove your packages (ie:/Users/hilarl/Desktop/client/node_modules)
rm -R /Users/hilarl/Desktop/client/node_modules
Clean the npm cache:
npm cache clean
and after that retry to re-install packages
npm i
If it doesn't work, share your new error message