Update to latest Polymer using Bower - json

I have a Polymer application which is configured as following:
My main project bower.json file:
{
"name": "Raf",
"authors": [
"Raffaeu <raffaeu#gmail.com>"
],
"description": "Test Project",
"dependencies": {
"polymer": "Polymer/polymer#1.2.0",
"iron-elements": "PolymerElements/iron-elements#^1.0.8",
"paper-elements": "PolymerElements/paper-elements#^1.0.7"
}
}
and inside my bower_components folder I do have a polymer folder with the following JSON:
{
"name": "polymer",
"version": "1.2.0",
"main": [
"polymer.html"
],
"repository": {
"type": "git",
"url": "https://github.com/Polymer/polymer.git"
},
"dependencies": {
"webcomponentsjs": "^0.7.2"
}
}
Now, if I am in the root folder (where the main bower.json file is located) and I am running bower info polymer bower returns me the following list of versions:
bower cached https://github.com/Polymer/polymer.git#1.6.0
bower validate 1.6.0 against https://github.com/Polymer/polymer.git#*
{
name: 'polymer',
version: '1.6.0',
...
But if I run bower update polymer --save console returns following message and doesn't update to 1.6.0 but it stays to my current version which is 1.2.0:
Unable to find a suitable version for polymer, please choose one by typing one of the numbers below:
1) polymer#1.2.0 which resolved to 1.2.0 and is required by MyTestProject
2) polymer#~1.2.0 which resolved to 1.2.4 and is required by paper-datatable#0.9.8
3) polymer#^1.2.0 which resolved to 1.6.0 and is required by iron-behaviors#1.0.13
4) polymer#^1.2.1 which resolved to 1.6.0 and is required by paper-behaviors#1.0.11
5) polymer#^1.2.4 which resolved to 1.6.0 and is required by iron-menu-behavior#1.1.3
6) polymer#^1.1.1 which resolved to 1.6.0 and is required by vaadin-grid#1.0.0
7) polymer#^1.0.0 which resolved to 1.6.0 and is required by iron-a11y-keys-behavior#1.1.1
8) polymer#^1.1.0 which resolved to 1.6.0 and is required by paper-dropdown-menu#1.1.3
Prefix the choice with ! to persist it to bower.json
? Answer 1
And nothing is updated.
Should I manually change version to 1.6.0 inside the polymer folder then run update?

you need to select !3 this will add a new object in your bower.json called resolutions with value as polymer#^1.2.0. Using ! will persist your choice in bower.json. As you are selecting first option it is taking the version from your bower.json which is set to use exact version i.e. 1.2.0.
Actually, you can select anything after 3rd option as they all are latest above mentioned version because of '^'.

Related

JetBrains WebStorm Jest encountered an unexpected token

I have a problem with running a simple project in WebStorm IDE. This is what I get when I hit run:
Test suite failed to run
Jest encountered an unexpected token
This usually means that you are trying to import a file which Jest cannot parse, e.g. it's not plain JavaScript.
By default, if Jest sees a Babel config, it will use that to transform your files, ignoring "node_modules".
Here's what you can do:
• To have some of your "node_modules" files transformed, you can specify a custom "transformIgnorePatterns" in your config.
• If you need a custom transformation specify a "transform" option in your config.
• If you simply want to mock your non-JS modules (e.g. binary assets) you can stub them out with the "moduleNameMapper" config option.
You'll find more details and examples of these config options in the docs:
https://jestjs.io/docs/en/configuration.html
Details:
/home/patryk/WebstormProjects/Case Converter/node_modules/hs-test-web/hstest/stage/stageTest.js:12
runner = new PureJsApplicationRunner();
^
SyntaxError: Unexpected token =
at ScriptTransformer._transformAndBuildScript (node_modules/jest/node_modules/jest-runtime/build/script_transformer.js:403:17)
at Object.<anonymous> (node_modules/hs-test-web/hstest/index.js:1:110)
At this moment, my project contains just 1 html file. I tried reinstalling nodejs and npm, but that didn't work
Good time of day,
I've encoutered the same problem with one Edu project in WebStorm IDE - when i pressed the "check" button for task - i've got issue:
"test suite failed to run
Jest encountered an unexpected token ..."
How it was solved:
Please check if nodejs and npm installed - At IDE: File\Settings, section: Languages & frameworks > nodejs and npm section > at field: "Node interpreter" you'll find something like : "node /usr/bin/node" and at field: "Package manager" the value "npm /usr/share/npm"
In IDE - you need to expand "Project pane" and to choose view mode "Project Files" - then you need open the file "package.json",
initially this file contains the code:
{
"devDependencies": {
"#types/jest": "^23.3.12",
"hs-test-web": "https://github.com/hyperskill/hs-test-web/archive/release.tar.gz",
"jest": "^27.3.1",
"puppeteer": ">=8.0.0"
},
"scripts": {
"test": "jest"
}
}
You need to add the section for "jest" - please found the complete package.json below
{
"devDependencies": {
"#types/jest": "^23.3.12",
"hs-test-web": "https://github.com/hyperskill/hs-test-web/archive/release.tar.gz",
"jest": "^27.3.1",
"puppeteer": ">=8.0.0"
},
"scripts": {
"test": "jest"
},
"jest": {
"verbose": true,
"moduleFileExtensions": [
"ts",
"tsx",
"js",
"jsx",
"json"
],
"transform": {
"^.+\\.jsx?$": "babel-jest",
"^.+\\.tsx?$": "<rootDir>/node_modules/ts-jest/preprocessor.js"
},
"transformIgnorePatterns": ["/node_modules/(?!lodash-es)"],
"testRegex": "test/.*\\.spec\\.ts$"
}
}
So,i hope it help you.

gulp-eslint Environment key "es2021" is unknown

I have a project with the following dependencies;
"dependencies": {
"express": "^4.17.1"
},
"devDependencies": {
"browser-sync": "^2.26.13",
"del": "^6.0.0",
"eslint": "^7.16.0",
"eslint-config-standard": "^16.0.2",
"eslint-plugin-import": "^2.22.1",
"eslint-plugin-node": "^11.1.0",
"eslint-plugin-promise": "^4.2.1",
"gulp": "^4.0.2",
"gulp-cssmin": "^0.2.0",
"gulp-eslint": "^6.0.0",
"gulp-htmllint": "0.0.19",
"gulp-htmlmin": "^5.0.1",
"gulp-imagemin": "^7.1.0",
"gulp-jsmin": "^0.1.5"
When I try to run a gulp task that lints javascript, using eslint/gulp-eslint;
function javascript() {
return src('private/script/**')
//.pipe(jsmin())
.pipe(eslint())
.pipe(eslint.format())
.pipe(eslint.failAfterError())
.pipe(dest('public/script'));
}
I get the following error;
Error: .eslintrc.json » eslint-config-standard:
Environment key "es2021" is unknown
I used npx eslint --init to generate the following configuration file;
{
"env": {
"browser": true,
"commonjs": true,
"es6": true
},
"extends": [
"standard"
],
"globals": {
"Atomics": "readonly",
"SharedArrayBuffer": "readonly"
},
"parserOptions": {
"ecmaVersion": 2018
},
"rules": {
}
}
i have done an npm install, to make sure I have the latest version of the dependencies. I have also read on guthub that the error might have something to do with gulp-eslint as it is an old version and might not be using the current version of eslint, however, in I have changed gulp-eslint package.json to use the latest version of eslint and no luck. I also updated node/npm to their latest lts versions.
I fixed this by deleting the eslint folder in the node_modules folder for gulp-eslint. this forces node to use the version you have as a dependency rather than the version the project maintainer wants to use.
it appears this is a known issue.
I solve it by upgrading eslint version to version 7
This is what my package json looks like
The problem is that gulp-eslint works with ESLint 6 under the hub, and ESLint 6 does not support the es2021 environment (see the supported environments of ESLint 6).
I'm going to show three options to handle this. The best solution will depend on your setup and requirements.
Method 1: Replace es2021 with an equivalent definition
The es2021 environment is the same as es2020 with the addition of the globals AggregateError, FinalizationRegistry and WeakRef (see the definition of es2021), so you could enter these settings in your .eslintrc configuration file instead to obtain the same result.
{
...
"env": {
...
"es2020": true
},
...
"globals": {
...
"AggregateError": "readonly",
"FinalizationRegistry": "readonly",
"WeakRef": "readonly"
},
...
}
Method 2: Force gulp-eslint to use ESLint 7
If you are using npm >= 8.3 < 9.0 (check this with npm -v), you can override the version of ESLint used by gulp-eslint.
To do so, first add an override entry to your package.json file like this:
{
...
"overrides": {
"gulp-eslint": {
"eslint": "7"
}
},
...
}
then run:
npm install
Now, gulp-eslint will work with the latest version of ESLint 7 which does recognize the es2021 environment (it exists in ESLint >= 7.8).
Note that gulp-eslint does still not support ESLint 7, so some things may not work as expected. Particularly, some plugins may fail to load or produce runtime errors.
Method 3: Use gulp-eslint-new
gulp-eslint-new works with ESLint 8 and can be used in most situations as a drop-in replacement for gulp-eslint, provided that the configuration is compatible with both versions.
Uninstall gulp-eslint with
npm uninstall gulp-eslint
Install gulp-eslint-new with
npm install -D gulp-eslint-new
In your gulpfile, replace the import of gulp-eslint with gulp-eslint-new.
DISCLAIMER: I am currently the only maintainer of gulp-eslint-new.

Custom local npm module as dependency

I created a project using npm scripts in order to avoid the use of gulp. The thing is, my project has two scripts:
prepare.sh (uses wget to download some files and do mkdirs)
process.js (transform a json file into another overriding some keys)
package.json
{
"scripts": {
"process": "./process.js",
"prepare": "./prepare.sh $npm_package_config_source $npm_config_env",
"config": "npm run prepare && npm run process"
},
"config": {
"source": "https://myurl"
},
"devDependencies": {
"fs": "0.0.1-security",
"json-override": "^0.2.0"
}
}
So, if I want to apply the transform in this project I run npm run config, but I want this project to be part of another as a local module of a front-end project.
How can I set up my project? And when I add it as a dependency of my front project, how can I call the config script from the package.json of the front project?
You can add a bin object to your package.json which will result in files installed into the node_modules/.bin folder docs.npmjs.com/files/package.json#bin
example
{
"bin": {
"process": "./process.js",
"prepare": "./prepare.sh"
},
"scripts": {
"config": "prepare && process"
},
"devDependencies": {
"fs": "0.0.1-security",
"json-override": "^0.2.0"
}
}
Also since npm runs scripts with node_modules/.bin as part of the path you can simply call them by name only. Just remember to add #!/usr/bin/env node to the top of process.js

Why Composer's package dependencies are not being installed?

I've got the following composer.json file:
{
"require": {
"local/my_package": "dev-master"
},
"repositories": [
{
"packagist.org": false
},
{
"type": "path",
"url": "my_package/"
}
]
}
which requires my local package which defines the following my_package/composer.json file:
{
"name": "local/my_package",
"require-dev": {
"symfony/console": "*"
}
}
Note: The my_package folder is under Git repository with the default master branch.
Note: To create new repo, run: git init && git add -A && git commit -am'Files'.
When I run: composer install -vvv, the local/my_package package is installed correctly, but nothing else. I would expect that dependencies defined in symfony/console should be installed as well.
Executing command (my_package/): git log -n1 --pretty=%H
- Installing local/my_package (dev-master)
How should I correct my composer.json file, so the package's dependencies can be installed automatically?
It seems the require-dev keyword in the package's composer.json file should be changed to require.
The require-dev property is only required for developing the package (root package).

Why does main-bower-files filter some packages?

I've got a gulp task which is intended to copy bower dependencies to another folder, but only a subset of the dependencies are being matched.
Here's a simplified version of the task which just prints out the matching paths:
gulp.task('list-dependencies',function() {
gulp.src(mainBowerFiles('**/*'), { base: './bower_components' })
.pipe($.print());
});
Here's the bower.json file contents:
bower.json
{
"name": "app",
"private": true,
"dependencies": {
"bootstrap": "3.0.0",
"jquery": "1.10.2",
"modernizr": "~2.8.3",
"angular": "~1.4.4",
"angular-ui": "~0.4.0",
"angular-route": "~1.4.4"
}
}
Here's a listing of the bower_components folder:
$ ls bower_components/
angular angular-route angular-ui bootstrap jquery modernizr
outut:
[13:30:08] Starting 'list-dependencies'...
[13:30:08] Finished 'list-dependencies' after 27 ms
[gulp] bower_components\jquery\jquery.js
[gulp] bower_components\angular\angular.js
[gulp] bower_components\angular-route\angular-route.js
[gulp] bower_components\bootstrap\dist\js\bootstrap.js
[gulp] bower_components\bootstrap\dist\css\bootstrap.css
As you can see, angular-ui and modernizr aren't listed. Can someone explain why this is happening?
Bower has a concept of defining "main" files within a bower.json. The packages that were missed were due to the fact that these packages didn't contain a bower.json file which defined the main files. To get the main-bower-files plugin to work, you have to define overrides either within your bower file or as a parameter to main-bower-files.