I'm testing npm package called "my-npm-package".
I tried to use the module in another project :
import { route } from "my-npm-package";
console.log(route);
But I got this error :
Uncaught TypeError: Failed to resolve module specifier "my-npm-package". Relative references must start with either "/", "./", or "../".
Here's my package contents :
my-npm-package/
├─ lib/
│ ├─ index.js
├─ package.json
index.js
export const route = () => {
...
}
package.json
{
"name": "my-npm-package",
"version": "1.0.0",
"description": "",
"license": "MIT",
"author": "",
"main": "./lib/index.js",
"repository": {
"type": "git",
"url": "https://github.com/my-npm-package.git"
}
}
In addition to this, I tried transpiling and bundling using webpack and babel, but the same error still occurred.
I searched Google for related information and looked through the stack overflow, but I don't know the solution.
Related
I'm trying to use Parcel to build a library, and am trying to import an index.scss file into my index.js file, it either fails to 'install #parcel/transformer-sass' if I don't include it as a dependency, or 'cannot find module "#parcel/transformer-sass"' when I do install it. Notably, Parcel will build successfully if I import an index.css' file into index.js` instead.
Does anyone know what I'm doing wrong?
Installing npm i #parcel/transformer-scss as a dependency, for which I get the error:
× Build failed.
Error: Failed to install #parcel/transformer-sass: Callback must be a function. Received undefined
Error: Failed to install #parcel/transformer-sass: Callback must be a function. Received undefined
at install
(C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\#parcel\package-manager\lib\installPackage.js:131:11)
at processTicksAndRejections (internal/process/task_queues.js:95:5)
at async PromiseQueue._runFn
(C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\#parcel\utils\lib\PromiseQueue.js:88:7)
at async PromiseQueue._next
(C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\#parcel\utils\lib\PromiseQueue.js:75:5)
Installing #parcel/transformer-sass and #parcel/config-default, for which I receive the error:
× Build failed.
#parcel/core: Cannot find Parcel plugin "#parcel/transformer-sass"
C:\...\nvm\v14.18.0\node_modules\parcel\node_modules\#parcel\config-default\index.json:25:23
24 | "*.{styl,stylus}": ["#parcel/transformer-stylus"],
> 25 | "*.{sass,scss}": ["#parcel/transformer-sass"],
> | ^^^^^^^^^^^^^^^^^^^^^^^^^^ Cannot find module "#parcel/transformer-sass"
26 | "*.less": ["#parcel/transformer-less"],
27 | "*.{css,pcss}": ["#parcel/transformer-postcss", "#parcel/transformer-css"],
I also tried creating a .parcelrc of various configurations, including:
{
"transformers":{".scss":"#parcel/transformer-scss"}
}
and
{
"extends":"#parcel/config-default",
"transformers":{".scss":"#parcel/transformer-scss"}
}
which throw similar errors.
Here's my package.json:
"name": "frontend",
"version": "1.0.0",
"description": "",
"source": "src/index.js",
"targets": {
"default": {
"distDir": "../staticfiles"
}
},
"main": "index.js",
"module": "module.js",
"scripts": {
"watch": "parcel watch",
"build": "parcel build"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"parcel": "latest"
},
"dependencies": {
"#parcel/config-default": "^2.0.0",
"#parcel/transformer-sass": "^2.0.0",
"#popperjs/core": "^2.10.2",
"bootstrap": "^5.1.3",
"bootstrap-table": "^1.18.3",
"jquery": "^3.6.0"
}
}
here's my index.js:
import "./index.scss";
import 'bootstrap';
import 'bootstrap-table';
import $ from "jquery";
console.log($)
window.jQuery = $;
window.$ = $;
console.log("hello world");
$(function() {
$('#table').bootstrapTable()
})
Here's my index.scss:
#import "bootstrap/scss/bootstrap";
#import "bootstrap-table/dist/bootstrap-table";
// #import "bootstrap-table/dist/extenstions/filter-control/bootstrap-table-filter-control";
$body-color: slateblue;
body {
color: $body-color;
font-family: sans-serif;
}
The problem of Callback must be a function. Received undefined occurs when using parcel in a project directory that has a parent directory with an (unrelated) yarn.lock file.
To reproduce run touch ~/yarn.lock and then run parcel in a subdirectory of ~/.
To fix the issue delete any yarn.lock files in parent directories.
I had a problem with running the parcel, probably due to a node.js update, I updated the parcel and installed #parcel/transformer-sass there: https://www.npmjs.com/package/#parcel/transformer-sass.
After that, the parcel works fine.
I have a project that requires a private repo as a dependency. So, projectA has this included in the package.json as "projectB": "user/repo". This installs just fine, and is listed in projectA node_modules. The problem is, that node throws and error where I require the functions of the dependency. The error being that "Cannot find module projectB". As mentioned, projectB is listed in node_modules. Here is the structure of projectB:
.
├── README.md
├── file1.js
├── file2.js
├── file3.js
├── file4.js
└── package.json
It also has its own node_modules, but I've left that out. Now, here is what file1.js might look like:
function getResult (a, b) {
return a + b;
}
module.exports = { getResult }
And here is what projectA looks like:
var calculate = require('projectB').file1.getResult; // I've tried this in several other ways too
Calling calculate results in the "Cannot find module error". Have I done something fundamentally wrong in setting up for using a private repo as dependency and/or requiring it wrong?
Update projectB package.json
{
"name": "projectB",
"version": "1.0.0",
"description": "Backend utility functions",
"scripts": {
"test": "mocha"
},
"repository": {
"type": "git",
"url": "git+https://github.com/user/repo.git"
},
"author": "Me",
"license": "ISC",
"bugs": {
"url": "https://github.com//user/repo/issues"
},
"homepage": "https://github.com//user/repo#readme",
"dependencies": {
"lodash": "^4.17.4",
"mongodb": "^2.2.25",
"redis": "^2.7.1",
"winston": "^2.3.1"
}
}
projectB needs to be updated to set an appropriate main, but by default this will be index.js. You could do something like the following:
// projectB/index.js
exports.file1 = require("./file1");
exports.file2 = require("./file2");
exports.file3 = require("./file3");
exports.file4 = require("./file4");
It's actually a pretty common pattern to have an index.js that does nothing but export from library files.
This is my first time using a private repo as a dependency in another project. I think I am doing it right, but the dependency is not available in the new project after install and is not in node_modules.
Following this post I can see that I am including it in the package.json correctly like:
"myPackage": "git+https://github.com/myusername/mygitrepository.git"
When I run npm install on this package, I see this that it does not have an error, but after this dependency in the list, it is shown with extraneous(git+https://github.com/myusername/mygitrepository.git).
Even though there is the extraneous issue, there is no error, and the dependency is not available or listed in node_modules.
Update: repo_A package.json
{
"name": "project-name",
"version": "1.0.0",
"description": "Backend utility functions",
"scripts": {
"test": "mocha"
},
"repository": {
"type": "git",
"url": "git+https://github.com/user/repo.git"
},
"author": "me",
"license": "ISC",
"bugs": {
"url": "https://github.com/user/repo/issues"
},
"homepage": "https://github.com/user/repo#readme",
"dependencies": {
"lodash": "^4.17.4",
"mongodb": "^2.2.25",
"redis": "^2.7.1",
"winston": "^2.3.1"
}
}
Update: repo_B package.json
{
"name": "main-project-name",
"version": "1.0.0",
"description": "",
"repository": {
"type": "git",
"url": "git+https://github.com/user/repo.git"
},
"author": "someone else",
"homepage": "https://github.com/user/repo.git",
"dependencies": {
"async": "2.1.4",
"chai": "^3.5.0",
"langs": "1.1.0",
"lodash": "4.13.1",
"node-stopwatch": "0.0.1",
"request": "2.74.0",
"winston-loggly": "^1.3.1",
"utils": "user/repo_A.git#master"
},
"scripts": {
"test": "mocha"
}
}
Update for latest steps
Here are the steps I am following now to test each possible solution, followed by the output:
rm -rf node_modules
npm cache clean
npm install
Output
├─┬ async#2.1.4
│ └── lodash#4.17.4
├─┬ chai#3.5.0
│ ├── assertion-error#1.0.2
│ ├─┬ deep-eql#0.1.3
│ │ └── type-detect#0.1.1
│ └── type-detect#1.0.0
├── util#1.0.0 extraneous (git+ssh://git#github.com/user/repo_A.git#commit-ish)
.......
If you specify https then that will be looking for a login user and password I believe, which I don't think it can load automatically. I would list it simply as "user/repo" and make sure that machine has an ssh key on it that is in github like the setup described in help such as https://help.github.com/articles/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent/#platform-linux and that things are setup so that pulling down that repo does not require user interaction.
EDIT: After testing, I think the issue is that your name in the package.json does not match how you have listed it in your main project's dependencies. In my test, this resulted in the modules being installed but I got the extraneous message.
I'm using node v0.10.32. Windows 8.1.
My objective is to link a node application as a node_module in another main app.
I go to my-module folder and do
npm link
Then, I go to the main-app folder and do
npm link my-module
This is the result
c:\dev\main-app>npm link my-module
unbuild my-module#0.0.2
c:\dev\main-app\node_modules\my-module -> C:\Users\Nizar\AppData\Roaming\npm\node_modules\my-module -> C:\dev\my-module
But, the linkage does NOT seem to work, require('my-module') throws the following error
c:\dev\main-app>node app.js
module.js:340
throw err;
^
Error: Cannot find module 'my-module'
at Function.Module._resolveFilename (module.js:338:15)
my-module is indeed v0.0.2.
I can access it from main-app/node_module/my-module
This folder exists C:\Users\Nizar\AppData\Roaming\npm\node_modules\my-module
my-module package.json has "name": "my-module"
Moreover, %NODE_PATH% is correctly set:
c:\dev\main-app>echo %NODE_PATH%
C:\Users\Nizar\AppData\Roaming\npm\node_modules
Ideas?
There are a few things to try. On Windows, npm link is handled by creating junction points. Issuing a dir node_modules command should result in a line like:
01/15/2016 11:02 AM <JUNCTION> my-module [C:\Users\Nizar\AppData\Roaming\npm\node_modules\my-module]
Assuming that's there, then the problem is more than likely:
A lack of an index.js file (which is the default filename node uses to resolve modules)
You're using a different file than index.js as the main file of your module, in which case you need to tell node what that file is, by using the main key in your package.json file.
For example (taken from here):
{
"name": "node-js-sample",
"version": "0.2.0",
"description": "A sample Node.js app using Express 4",
"main": "index.js", // <-- LIKE THIS
"scripts": {
"start": "node index.js"
},
"dependencies": {
"express": "^4.13.3"
},
"engines": {
"node": "4.0.0"
},
"repository": {
"type": "git",
"url": "https://github.com/heroku/node-js-sample"
},
"keywords": [
"node",
"heroku",
"express"
],
"author": "Mark Pundsack",
"contributors": [
"Zeke Sikelianos <zeke#sikelianos.com> (http://zeke.sikelianos.com)"
],
"license": "MIT"
}
I have published a jRCarousel jQuery plugin to npm. I initially got the error that name can not contain capital letters, so I have changed that in package.json and then published it got published but on npm website when I try the "Try it out" option I get the "ReferenceError: jQuery is not defined" error. Not sure why is the error as I have specified the dependency in package.json.
Also if there are any changes to only package.json and not to any other files in package or module , how can I update only the package.json file on npm, or do I have to publish it new version no.(which I want to avoid).
Here is my package.json
{
"name": "jrcarousel",
"version": "1.0.0",
"description": "jRCarousel - jQuery Responsive Carousel,
a modern, lightweight responsive carousel plugin",
"main": "dist/jRCarousel.min.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "https://github.com/vinayakjadhav/jRCarousel.git"
},
"keywords": [
"jquery-plugin",
"ecosystem:jquery",
"jQuery Resposive Carousel",
"jQuery slider",
"Responsive Slider",
"Carousel",
"Slider",
"Gallery",
"lightweight"
],
"author": "Vinayak Rangnathrao Jadhav",
"license": "MIT",
"dependencies": {
"jquery": "^1.9.1"
},
"bugs": {
"url": "https://github.com/vinayakjadhav/jRCarousel/issues"
},
"homepage": "https://github.com/vinayakjadhav/jRCarousel",
"devDependencies": {}
}
npm package
Github Repository
TRY IT OUT Link
Note: I am new to npm, have searched a lot but very less info available related to jquery-plugin publishing. Any help is appreciated.
Wrap your plugin with this code. It's the UMD pattern that allows your plugin to run inside browser and most of module bundlers.
(function (root, factory) {
if (typeof define === "function" && define.amd) {
define(["jquery"], factory);
} else if (typeof exports === "object") {
module.exports = factory(require("jquery"));
} else {
factory(root.jQuery);
}
}(this, function ($) {
...your plugin code goes here...
}));