Why npm start not working after npm init? - javascript

I have initiated a new project with NPM :
npm init
I have installed the socket.io-client package.
package.json:
{ "name": "client", "version": "1.0.0", "description": "", "main": "script.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1" }, "author": "", "license": "ISC", "dependencies": { "socket.io-client": "^4.5.4" } }
script.js:
import { io } from "socket.io-client";
const socket = io('http://localhost:3000')
socket.on('connect', () => {
console.log('Hello - ' + socket.id)
})
The error I get:
npm ERR! Missing script: "start"
I have added the start command to package.json:
"start": "node script.js"
Now I get:
SyntaxError: Cannot use import statement outside a module
I have tried adding start command, and did not worked.

You can try one of these:
Add type="module" to whereever you import your script.
Add "type": "module" to your package.json file.
See more here: "Uncaught SyntaxError: Cannot use import statement outside a module" when importing ECMAScript 6

Related

babel-node --presets node '.' is not recognized as an internal or external command,

this is the dependencies in package.json
{
"name": "whatsapp",
"version": "1.0.0",
"description": "whatsapp-clone-in-mern-stack",
"main": "server.js",
"scripts": {
"start": "./node_modules/babel-cli/bin/babel-node.js --presets node8 ./server.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "someone",
"license": "ISC",
"dependencies": {
"babel": "^6.23.0",
"babel-cli": "^6.26.0",
"babel-preset-node8": "^1.2.0",
"body-parser": "^1.19.0",
"compression": "^1.7.4",
"cors": "^2.8.5",
"express": "^4.17.1",
"moment": "^2.29.1",
"mongoose": "^6.0.14"
}
}
code in server.js file
import App from "express";
import connectDB from "./dbConnection";
const app = new App();
const PORT = 3001;
const startServer = () => {
Promise.all([connectDB()]).then(() => {
app.listen(PORT);
console.log(`Server started on port ${PORT}`);
});
};
startServer();
code in index.js file
import mongoose from "mongoose";
const DB_CONNECTION_URL = "mongodb://localhost:27017/test";
const connectDB = () => {
console.log("DB trying to connect on " + new Date());
const options = {
keepAlive: 1,
autoReconnect: true,
poolSize: 10,
useNewUrlParser: true,
useUnifiedTopology: true,
};
return mongoose.connect(DB_CONNECTION_URL, options);
};
export default connectDB;
error in console
whatsapp#1.0.0 start C:\Users\krish\onedrive\desktop\whatsapp_clone-mern_Stack\whatsapp-clone\server
> ./node_modules/babel-cli/bin/babel-node.js --presets node8 ./server.js
'.' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! whatsapp#1.0.0 start: `./node_modules/babel-cli/bin/babel-node.js --presets node8 ./server.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the whatsapp#1.0.0 start 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\krish\AppData\Roaming\npm-cache\_logs\2021-11-30T
09_26_47_364Z-debug.log
Learning from YouTube tutorials, I tried to make a whatsapp clone. I wanted to use babel cli and babel node to start the server in order to connect the database, so I wrote this code { "./node_modules/babel-cli/bin/babel-node.js --presets node8 ./server.js" } in the scripts, but it displays the above error. Please help me.
The error you are encountering is due to using *nix path syntax in Windows. Try writing the path with windows backslashes or try
babel-node --presets node8 .\server.js
write this
"scripts": {
"start": "node ./node_modules/babel-cli/bin/babel-node.js --presets node8 ./server.js",
"test": "echo \"Error: no test specified\" && exit 1"
},
instead of this
"scripts": {
"start": "./node_modules/babel-cli/bin/babel-node.js --presets node8 ./server.js",
"test": "echo \"Error: no test specified\" && exit 1"
},

cant import module from webpack bundle.js in script tag HTML

I use webpack for make bundler my js file for use in my django project. I use moment js which i get from "npm i moment". I make webpack with this configuration.
var path = require('path');
module.exports = {
"mode" : "development",
"entry" : "./index.js",
"output" : {
"path" : path.resolve(__dirname, "tugas/assets"),
"filename" : "bundles.js",
"clean" : true,
},
};
and this is my index.js for configuration before.
import moment from 'moment';
console.log(moment().format('MMMM Do YYYY, h:mm:ss a'));
console.log("boma1");
This is my package.json.
{
"name": "Aplikasi-Database-Django",
"version": "1.0.0",
"description": "Tugas UAS Database Semester 7 2020",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack --config webpack.config.js"
},
"repository": {
"type": "git",
"url": "git+https://github.com/simasona123/Aplikasi-Database-Django.git"
},
"keywords": [],
"author": "",
"license": "ISC",
"bugs": {
"url": "https://github.com/simasona123/Aplikasi-Database-Django/issues"
},
"homepage": "https://github.com/simasona123/Aplikasi-Database-Django#readme",
"devDependencies": {
"webpack": "^5.31.2",
"webpack-cli": "^4.6.0"
},
"dependencies": {
"chart.js": "^3.1.0",
"moment": "^2.29.1"
}
}
as i know, webpack success to make bundle of moment.js because console can make output
but from above picture i cant import moment.js
this is my html code
This is my tree directory.
Thanks for your help... sorry for my bad question....
You should use require for moment.js, so replace what you have for the import with:
const moment = require('moment');
Alternatively, if you want to still use the import statement, this should work as well:
import * as moment from 'moment';
There's a discussion of this already here.

Run a mocha test?

Good evening, i am learning about testing and have installed mocha. I have a basic test that just compares 2 numbers and i cant get it to run. could anyone explain to me why and how to fix this?
Json
{ "scripts": {
"test": "mocha test/**/*.js"
},
"name": "image-gallery",
"version": "1.0.0",
"description": "",
"main": "script-test.js",
"directories": {
"test": "script-test.js"
},
"author": "",
"license": "ISC"
}
Test.js
const assert = require('assert');
describe('number test', function() {
it('matching numbers', function() {
assert.ok(2 === 2);
});
});
Did you install mocha by running this in your project directory?
npm install --save-dev mocha

How can I make the ESM work with electron in my project?

I've been trying fix for this a week now but can't really seem to find the problem.
I've followed this tutorial but instead of having that project structure I've my own (see image below)
In the esm.js:
require = require("esm")(module);
module.exports = require("./vickie.js");
Then i've changed vickie.js:
From const { app, BrowserWindow, ipcMain } = require('electron')
To import { app, BrowserWindow, ipcMain } from 'electron'
Then I got this error
In package.json:
{
"name": "vickie",
"type": "module",
"version": "0.0.1",
"description": "",
"main": "./vickie.js",
"scripts": {
"start": "electron ./vickie.js"
},
"author": "Arijanit",
"license": "ISC",
"devDependencies": {},
"dependencies": {
"dotenv": "^8.2.0",
"electron": "^8.2.3",
"electron-builder": "^22.5.1",
"esm": "^3.2.25",
"mysql2": "^1.7.0"
}
}
Why am I getting the error? Should I type in something extra in package.json to enable esm?
Thanks in advance
I created a build tool that lets you use ESM in your own Electron code and modules installed from npm:
https://github.com/mifi/build-electron
To use it:
yarn add -D build-electron concurrently wait-on
Put your Electron main ESM source code in src/main/index.js and preload source in src/preload/index.js.
Add to your package.json:
{
"main": "build/main.js",
"build": {
"files": [
"build/**/*"
]
},
"scripts": {
"start": "concurrently -k \"build-electron -d\" \"wait-on build/.build-electron-done && electron .\"",
"build": "build-electron"
}
Now create a configuration file in your project root build-electron.config.js:
module.exports = {
mainEntry: 'src/main/index.js',
preloadEntry: 'src/preload/index.js',
outDir: 'build',
mainTarget: 'electron16.0-main',
preloadTarget: 'electron16.0-preload',
}
Now you can start developing:
npm run start
And to build your production app:
npm run build && npm exec electron-builder --mac

npx webpack - Cannot read property 'minify' of undefined

I'm following the basic tutorial of webpack from this link : https://webpack.js.org/guides/getting-started/
when I run npx webpack it fails with the following error:
ERROR in main.js from Terser
TypeError: Cannot read property 'minify' of undefined
at minify (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/terser-webpack-plugin/dist/minify.js:175:23)
at module.exports (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/terser-webpack-plugin/dist/worker.js:13:40)
at handle (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/worker-farm/lib/child/index.js:44:8)
at process.<anonymous> (/Users/name/Documents/practice/webpack/webpack-demo/node_modules/worker-farm/lib/child/index.js:51:3)
at process.emit (events.js:188:13)
at emit (internal/child_process.js:828:12)
at process.internalTickCallback (internal/process/next_tick.js:72:19)
node version: v11.6.0
npm version: 6.5.0-next.0
webpack version: 4.29.0
webpack-cli version: 3.2.1
folder structure
/dist
index.html
/node_modules
/src
index.js
package-lock.json
package.json
index.html
<!doctype html>
<html>
<head>
<title>Getting Started</title>
</head>
<body>
<script src="main.js"></script>
</body>
</html>
index.js
import _ from 'lodash';
function component() {
let element = document.createElement('div');
element.innerHTML = _.join(['hello', 'webpack'], ' ');
return element;
}
document.body.appendChild(component());
package.json
{
"name": "webpack-demo",
"version": "1.0.0",
"description": "",
"private": true,
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.29.0",
"webpack-cli": "^3.2.1"
},
"dependencies": {
"lodash": "^4.17.11"
}
}
It's a bug and you can fix it by installing terser v3.14
Simply run:
npm i -D terser#3.14
Source: https://github.com/vuejs/vue-cli/issues/3407#issuecomment-459985313
The solution:
npm install terser#3.14.1 --save-dev

Categories

Resources