I'm having trouble getting the 'npm run dev' command to work, what steps should I take next?

When I try to run npm run dev in the command line, I encounter an error that I've been unable to resolve despite trying multiple solutions.

Below is the content of my package.json file:


{
  "name": "project",
  "version": "1.0.0",
  "description": "project",
  "main": "index.js",
  "scripts": {
    "dev": "webpack"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.11",
    "webpack-dev-server": "^3.11.0"
  },
  "dependencies": {
    "babel-polyfill": "^6.26.0"
  }
}

Additionally, here is the content of my webpack.config.js file:


const path = require('path');


module.export = {
    entry: './src/js/index.js',
    output: {
        path: path.resolve(__dirname, 'dist/js'),
        filename: 'bundle.js'
    },
    mode: 'development'
};

Despite updating npm and attempting commands like npm cache clean --force, the issue persists. Here's the error message I receive:


Insufficient number of arguments or no entry found.
Alternatively, run 'webpack(-cli) --help' for usage info.

Hash: c1735700111314ac598b
Version: webpack 4.43.0
Time: 62ms
Built at: 05/25/2020 1:24:29 PM

WARNING in configuration
The 'mode' option has not been set, webpack will fallback to 'production' for this value. Set 'mode' option to 'development' or 'production' to enable defaults for each environment.
You can also set it to 'none' to disable any default behavior. Learn more: https://webpack.js.org/configuration/mode/

ERROR in Entry module not found: Error: Can't resolve './src' in 'C:\Users\usman\Desktop\coding\Forkify'
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! [email protected] dev: `webpack`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\usman\AppData\Roaming\npm-cache\_logs\2020-05-25T08_24_29_792Z-debug.log.

Answer №1

To resolve my issue with webpack cli, I took the following steps: I uninstalled webpack cli using PowerShell as an administrator and then reinstalled it using PowerShell as well. This approach worked flawlessly for me. I recommend downloading cli using PowerShell to avoid any administration problems. Here are the commands that I used:

npm uninstall webpack webpack-cli

For the installation process, I used the following commands:

npm install webpack webpack-cli --save-dev  

I trust that this information will be beneficial to you. Thank you

Answer №2

Would you mind trying to update your webpack.config.js with the following changes:

   const path = require("path");

module.exports = {
  entry: "./src/js/index.js",
  output: {
    path: path.resolve(__dirname, "dist/js"),
    filename: "bundle.js",
  },
  devServer: {
    contentBase: path.resolve(__dirname, "dist"),
    publicPath: "/js/",
  },
};

Additionally, please modify the scripts object in your package.json file as shown below:

  "scripts": {
"serve": "webpack-dev-server --mode development"

},

Finally, run this command: npm run serve

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Moving data from one table to another and making changes or removing it

After successfully adding data from one table to another using .click, I encountered an issue. Whenever I utilize the search field in the top table, it clears the appended rows in the bottom table. I am looking for a solution to have these tables generate ...

The AngularJs 2 framework encountered an issue with booting up after attempting to combine all TypeScript files into a single JavaScript file

I am currently utilizing Angular 2 with TypeScript (V-1.8) in my project setup. I have configured my tsconfig to output the code into a single .js file. This single.js file includes the necessary code to bootstrap the application, as the boot.ts file is al ...

Encountered a problem with AngularUniversal prerendering: UnhandledPromiseRejectionWarning: Unable to locate NgModule metadata for 'class{}'

Objective The task may seem lengthy, but it's straightforward! Currently, I am utilizing Angular Universal for Server-Side Rendering (SSR) by following a tutorial. The Universal/express-engine has been installed, main.js is generated in the dist/pro ...

The error message "GL_INVALID_OPERATION: Active draw buffers with missing fragment shader outputs" is alerting about a custom shader issue in

I am working on building a custom shader that will not be rendered. I specifically want to instruct the fragment shader not to write anything, therefore I am not setting gl_FragColor in the code. The shader program performs well on Firefox and Edge, howev ...

The art of defining PropTypes for the style attribute in Reactjs

Is there a way to pass the 'style' attribute into my component using JSX syntax? <InputTextWithValidation id="name" style={{width:'100%'}} .../> I'm wondering how I should define the PropTypes for ...

Malfunctioning designs arise when Angular-CLI deploys application with webpack

Encountering a strange issue while attempting to run my angular application using angular CLI. Executing ng serve results in the following message post-compilation : A Warning appears... (Emitted value instead of an instance of Error) Cannot find source ...

Troubleshooting: Why is jQuery Autocomplete failing to function with JSON PHP to JavaScript integration?

I need to implement an AutoComplete feature with a list of countries from a SQL database. 1. Using PHP: $sql_list_countries=(SQL request) var_dump: array (size=2) 0 => object(stdClass)[3] public 'meta_value' => string &apos ...

Encountering an Angular 13 ChunkLoadError during application deployment, despite the presence of the respective chunk

We encountered an issue with our application's upgrade from Angular 11 to 13. While running 'ng serve' on the local machine works fine, deploying it to our Azure app service causes the lazy loaded modules to fail loading. The specific error ...

Applying styles to an active router-link in Vuejs: A step-by-step guide

I have a sidebar that contains multiple sidebar items like the following: <side-bar> <template slot="links"> <sidebar-item :link="{name: 'Home', icon: 'ni ni-shop text-primary', path: '/dashboard'} ...

Refresh the Server Component once data has been modified by the Client Component within Next.js

I am still grappling with this specific scenario and trying to figure out the best approach in Next.js 13. Can anyone provide guidance on the correct way to handle this? In a Server Component, I have a list of users being displayed, leveraging MongoDB, as ...

What are the best practices for utilizing ESM only npm packages alongside traditional npm packages within a single JavaScript file?

Hey there, I'm fairly new to web development and I encountered a problem when trying to require two packages, franc and langs, in my index.js file. It turns out that franc is now an ESM only package, requiring me to import it and mention type:module i ...

Ways to exclusively allow cookies from my API server

I am running an Expressjs API server on localhost:4000, and my client on localhost:8008. Is there a way to ensure that my client only accepts cookies originating from my API server? At the moment, I am using fetch with credentials: 'include' to ...

Changes to the parent state will not be reflected in the child props

When the child component PlaylistSpotify updates the state localPlaylist of its parent, I encounter an issue where the props in PlaylistSpotify do not update with the new results. I've been struggling to figure out what I'm missing or doing wrong ...

Select multiple rows by checking the checkboxes and select a single row by clicking on it in the MUI DataGrid

I am currently utilizing the MUI DataGrid version 4 component. The desired functionalities are as follows: Allow multiple selections from the checkbox in the Data Grid (if the user selects multiple rows using the checkbox). Prevent multiple selections fr ...

Meteor: Transmitting Session data from the client to the server

Below is the code snippet I am utilizing on the client side to establish the Session variable: Template.download.events({ 'click button': function() { var clientid=Random.id(); UserSession.set("songsearcher", clientid); ...

The present URL of Next.js version 13

When working with Next.js App Router in SSR, how can I retrieve the complete URL of the current page? I am unable to use window.location.href due to the absence of a defined window object, and using useRouter() does not provide access to the full URL. ...

Experiencing an unexpected wait before the requestAnimationFrame?

Surprisingly, Internet Explorer is actually performing the way I want it to in this case :-) I developed a function for SVG animations using requestAnimationFrame (for simplicity, I left out the value calculations here ... but my initial test involved an ...

Having trouble getting Django to display images using jQuery? Uncaught Reference Error may be preventing it

Currently, I am experimenting with implementing a jquery example on my django-based website. As I am still in the learning phase, I kindly ask for your patience. This is a snippet of what my code looks like at this point: {% extends "base.html" %} {% loa ...

JavaScript's onclick function for clearing dropdown fields will only work once for each specific dropdown field

I have scoured all the related questions and answers on StackOverflow, but none seem to address my specific issue. Here is the HTML code I am using: <select name="search_month" onclick="javascript: $('#categories').val(null);" id="months"> ...

Navigating iFrames using Phantomjs Watir

Trying to access a login page using my script: Using PhantomJS and Watir. The issue with the login page is that the login textfields are within an iFrame: <iframe class="hiFrame" data-reactid=".0.0.0.1.0.1.0.0.$frame" src="https://instagram.com/accou ...