I have been following instructions from https://github.com/babel/babelify and I ran into an error along the way. I run the following line of code:
browserify script.js -o bundle.js -t [ babelify --presets [ #babel/preset-env #babel/preset-react ] --plugins [ #babel/plugin-transform-class-properties ] ]
The terminal produces the following error message:
Error: Cannot find module '#babel/plugin-transform-class-properties' from '/path/to/file' while parsing file: /path/to/file/circle-graph-2.js
My package.json file is
{
"name": "robert",
"version": "1.0.0",
"description": "This is the third step of my first attempt to learn canvas. I want to improve a piece a made a few weeks ago about the division of [occupations](http://nbremer.github.io/occupations/). The D3.js version has so many DOM elements due to all the small bar charts that it is very slow. Therefore, I hope that a canvas version might improve things",
"main": "server.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"babel": {
"presets": [
"es2015",
"react",
"transform-class-properties"
]
},
"author": "",
"license": "ISC",
"devDependencies": {
"#babel/core": "^7.1.6",
"babel-core": "^6.26.3",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-preset-es2015": "^6.24.1",
"babelify": "^10.0.0"
}
}
When I try the following line in the terminal then it says the package isn't found:
npm install --save-dev #babel/plugin-transform-class-properties
How do I overcome this error message?
Since you are on Babel 7 (based on your "#babel/core": "^7.1.6" entry), I think you are looking for npm install --save-dev #babel/plugin-proposal-class-properties which is the new version of the plugin for Babel 7. Notice the name change from "plugin-transform-class-properties" -> "babel-plugin-proposal-class-properties".
This was intentionally done by Babel to make people more aware of where features are in the TC39 process.
If you are actually still on Babel 6 (hard to tell since you have a Babel 7 and Babel 6 entry in your package.json, the comment by #Morty is what you need.
Had the same error for my project, but the npm install --save-dev #babel/plugin-proposal-class-properties install was not enough for me.
Searched for node-sass for babel 7.11.4 Found the fix here
I was basically in the wrong version so I added "#babel/core": "^7.13.14" to my package.json file and ran npm install again.
if you're using that latest version.
Just run npx babel-upgrade and it will display changes you need to update in your babel.rc file
Related
I'm developing an application in Vue, also using the x-ray-scraper library, but when I try to run npm run serve in the console to view the application locally I get the following error:
This dependency was not found:
* _http_common in ./node_modules/http-outgoing/index.js
To install it, you can run: npm install --save _http_common
Then I tried to run the command npm install --save _http_common and again I get an error:
npm ERR! code ETARGET
npm ERR! notarget No matching version found for undefined#_http_common.
npm ERR! notarget In most cases you or one of your dependencies are requesting
npm ERR! notarget a package version that doesn't exist.
Without the x-ray-scraper library, everything starts up fine, but if I include it in my project, errors appear.
Perhaps the error is related to the version, but I don't understand how to fix it.
My package.json looks like:
{
"name": "pc-components",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build"
},
"dependencies": {
"axios": "^0.21.0",
"cheerio": "^1.0.0-rc.3",
"core-js": "^3.6.5",
"dns": "^0.2.2",
"phantom": "^6.3.0",
"selenium-webdriver": "^4.0.0-alpha.8",
"vue": "^2.6.11",
"webpage": "^0.3.0",
"x-ray-scraper": "^3.0.6"
},
"devDependencies": {
"#vue/cli-plugin-babel": "~4.5.0",
"#vue/cli-service": "~4.5.0",
"vue-template-compiler": "^2.6.11"
}
}
Thanks for any help.
The issue has nothing to do with the import statement, nor are there any issue with the dependencies you have installed.
This is my test:
npm init into any directory you want
npm install x-ray-scraper
Then:
const x = require("x-ray-scraper");
x('google.com', 'title')
.then((title) => {
console.log(title); // Google
});
// logs Google
You need a simple backend, even a couple of lines long, in order to initiate the service and use the package.
You can use whatever you like in the front-end, Vue, React, etc.
You do not need any extra dependencies at all from what you already have.
Please read the docs to see use cases
When I try running npm run build for a new webpack build I get
You have installed webpack-cli and webpack-command together. To work with the "webpack" command you need only one CLI package, please remove one of them or use them directly via their binary.
I think I installed them globally. I tried, deleting them, webpack, deleating node clearing cache but I keep getting the same result.
Using webpack 4
{
"name": "ls",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"build": "webpack"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack": "^4.16.5",
"webpack-cli": "^3.1.0"
}
}
I think the message was quite clear so just run npm uninstall "webpack-command" to remove webpack-command (b/c "webpack-cli" has newer version)
I have setup jest and jest-junit as the reporter and followed the simple instructions given by jest-junit.
This includes npm install jest --save-dev and npm install jest-junit --save-dev
My package.json looks like this (excerpt):
"devDependencies": {
"jest": "^22.4.4",
"jest-junit": "^4.0.0",
},
"scripts": {
"test": "jest --ci --testResultsProcessor='jest-junit'"
},
"jest": {
"verbose": true,
"testResultsProcessor": "jest-junit"
},
"jest-junit": {
"suiteName": "Test Suite",
"output": "./junit.xml"
}
When running npm run test on my machine (OSX), it works well. When running it as part of the CI build process or on another Windows machine, I am getting the following error:
Module 'jest-junit' in the testResultsProcessor option was not found.
Maybe you just need to install the missing module to the other machine:
npm install jest-junit
Found the solution and it was the removal of inverted commas.
"test": "jest --ci --testResultsProcessor='jest-junit'"
should become
"test": "jest --ci --testResultsProcessor=jest-junit"
I wanted to setup webpack and babel with npm, but I got this error
npm ERR! Unexpected end of JSON input while parsing near '...pdragon":"^0.7.0","to' npm ERR! A complete log of this run can be found in:
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\luchan.vladyslav\AppData\Roaming\npm-cache\_logs\2017-12-10T10_48_56_298Z-debug.log
here is my package.json
{
"name": "ddd",
"version": "1.0.0",
"description": "components",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.2",
"babel-preset-env": "^1.6.1"
}
}
At the begining I have tried to install webpack webpack-dev-server babel-core babel-loader and babel-preset-env in one line. But I got this error, after a while I figured out that problem is related to webpack and wepback-dev-server
screenshot
Looks like the corrupt local node_modules is to be blamed. Can you remove the local node_modules folder and then freshly install by `npm install' ? That should fix the issue.
To solve this problem you should clean your cache with
npm cache clean --force
That will solve the problem
I have this in my package.json:
"devDependencies": {
...
"babel-cli": "^6.8.0",
"babel-core": "^6.8.0",
"babel-preset-es2015": "^6.6.0",
"babel-preset-react": "^6.5.0",
"babel-preset-stage-2": "^6.5.0",
...
}
And this in my .babelrc:
{
"presets": [
"react",
"es2015",
"stage-2"
]
}
When running babel --source-maps=true --out-dir=lib src I get this:
$ ./node_modules/.bin/babel --source-maps=true --out-dir=lib src
ReferenceError: [BABEL] src/main.js: Unknown option: /dev/my-project/.babelrc.presets
I have babel-cli 6, so why doesn't it recognize .babelrc.presets?
Answering my own question because I was trying to solve this for a while and I thought it might be helpful for others:
The problem was a known npm v3 bug. Unlike npm v2, npm v3 will flatten the dependency tree, so there was a deep dependency in my project that was including babel v5 and npm was linking the binary to my ./node_modules/.bin directory, overwriting the binary coming from my devDependency ("babel-cli": "^6.8.0").
The fix is to rebuild this package once npm install has finished. You should add this to your package.json:
"scripts": {
...
"postinstall": "npm rebuild babel-cli",
...
}