Is it possible to specify browserify config in package.json (other than transform)? - npm

In package.json we can specify browserify transforms like this:
"browserify": {
"transform": ["babelify"]
}
Is it possible to set other config like debug, detectGlobals, input source file, output file, etc. For example, something like:
"browserify": {
"debug": true,
"detectGlobals": false,
"transform": ["babelify"]
}
Thanks

In case you haven't found an answer to this yet:
Yes, it is and quite simple. You were very close. here's the example from the browserify README.md
{
"browserify": {
"transform": [["babelify", { "presets": ["es2015"] }]]
}
}
read more here.

Related

Composer require private repository from gitlab ssh ignored

I'm trying to pull a private repository from gitlab with composer without any success.
This is what I have in my composer.json file under repositories:
"repositories": [
{
"type": "vcs",
"url": "git#gitlab.com:the-vendor/dashboard-api.git"
}
]
When I clone the project like this: git#gitlab.com:the-vendor/dashboard-api.git manually, everything works fine.
Now when I require the project like so:
"require": {
"the-vendor/dashboard": "dev-orchestrate"
}
I also tried: "dev-main", "dev-main#dev", "dev-orchestrate#dev".
And run: composer update the-vendor/dashboard I get the following error:
Failed to download the-vendor/dashboard-api:The "https://gitlab.com/api/v4/projects/joij%2Fdashboard-api" file could not be downloaded (HTTP/2 404 ):
{"message":"404 Project Not Found"}
Your credentials are required to fetch private repository metadata (git#gitlab.com:the-vendor/dashboard-api.git)
A token will be created and stored in "/root/.composer/auth.json", your password will never be stored
To revoke access to this token you can visit https://gitlab.com/-/profile/personal_access_tokens
Username:
Installation failed, reverting ./composer.json and ./composer.lock to their original content.
I'm not sure what to make of this. Composer should be able to clone the project through ssh. But instead I get that vague 404 and then I have to give my username and password.
I also tried this:
"repositories": [
{
"type": "git",
"url": "git#gitlab.com:the-vendor/dashboard-api.git"
}
]
But then it behaves as if there is no "repositories" in the composer json at all, and I get this error:
Problem 1
- Root composer.json requires the-vendor/dashboard, it could not be found in any version, there may be a typo in the package name.
Potential causes:
- A typo in the package name
- The package is not available in a stable-enough version according to your minimum-stability setting
see <https://getcomposer.org/doc/04-schema.md#minimum-stability> for more details.
- It's a private package and you forgot to add a custom repository to find it
Read <https://getcomposer.org/doc/articles/troubleshooting.md> for further common problems.
This is the composer.json of the dashboard-api:
{
"name": "the-vendor/dashboard",
"type": "project",
"description": "TheVendor Dashboards",
"keywords": ["framework", "laravel"],
"license": "proprietary",
"require": {
"php": "^8.1",
"elasticsearch/elasticsearch": "v7.17.0",
"guzzlehttp/guzzle": "^7.2",
"laravel/framework": "^9.2",
"laravel/sanctum": "^2.14.1",
"laravel/tinker": "^2.7",
"ext-pdo": "*"
},
"require-dev": {
"fakerphp/faker": "^1.9.1",
"laravel/sail": "^1.0.1",
"mockery/mockery": "^1.4.4",
"nunomaduro/collision": "^6.1",
"phpunit/phpunit": "^9.5.10",
"phpspec/prophecy": "1.15.0",
"spatie/laravel-ignition": "^1.0"
},
"autoload": {
"psr-4": {
"TheVendor\\Dashboard\\": "app/",
"Database\\Factories\\": "database/factories/",
"Database\\Seeders\\": "database/seeders/"
}
},
"autoload-dev": {
"psr-4": {
"Tests\\": "tests/"
}
},
"scripts": {
"post-autoload-dump": [
"Illuminate\\Foundation\\ComposerScripts::postAutoloadDump",
"#php artisan package:discover --ansi"
],
"post-update-cmd": [
"#php artisan vendor:publish --tag=laravel-assets --ansi --force"
],
"post-root-package-install": [
"#php -r \"file_exists('.env') || copy('.env.example', '.env');\""
],
"post-create-project-cmd": [
"#php artisan key:generate --ansi"
]
},
"extra": {
"laravel": {
"providers": [
"TheVendor\\Dashboard\\Providers\\AppServiceProvider",
"TheVendor\\Dashboard\\Providers\\ESClientServiceProvider",
"TheVendor\\Dashboard\\Providers\\ESCreateIndexesServiceProvider"
],
"dont-discover": []
}
},
"config": {
"optimize-autoloader": true,
"preferred-install": "dist",
"sort-packages": true
},
"minimum-stability": "dev",
"prefer-stable": true
}
I wonder if anyone knows what I'm missing.
Alright! I found the problem. There is no need to go for an auth.json with an API Token. This is where I went wrong:
The main branch had a different package name! The branch I was trying to pull had the right one, but if the main composer.json has a different package name you get this error:
Root composer.json requires the-vendor/dashboard, it could not be found in any version, there may be a typo in the package name.
Once you have that, and require the package like this:
"require": [
"the-vendor/dashboard": "dev-orchestrate"
]
With this in the root of composer.json
"repositories": [
{
"type": "git",
"url": "git#gitlab.com:the-vendor/dashboard-api.git"
}
]
It will simply use ssh to clone the private repository

How to do module name alias for third party package

I have a app that created by react-native init command.
My app import websocket package which in turn require http package and cause error said "Unable to resolve module http".
i.e: myApp -> 3rd-module -> ws -> http
I try to work-around by install "#tradle/react-native-http", and added follow lines to my app's package json file:
"browser": { "http": "#tradle/react-native-http" },
"react-native": { "http": "#tradle/react-native-http" },
but it doesn't work.
I also try using babel-plugin-module-resolver but unluck either. Here is my .babelrc :
{
"presets": ["module:metro-react-native-babel-preset"],
"plugins": [
[
"#babel/plugin-proposal-decorators",
{
"legacy": true
}
],
["module-resolver", {
"alias": {
"#tradle/react-native-http": "http"
}
}]
]
}
How to do alias for my case? I research to fixing this problem by using webpack configuration, but don't know where is the configure file. After google, i think project created by react-native init use metro config instead of webpack.
try
["module-resolver", {
"alias": {
"http":"#tradle/react-native-http"
}
}]

Package.json, add local directory to node-modules

I have local library for some graphs and I need add it to node_modules. Is there any way how to add this library using package.json?
Our package.json looks like:
{
"name": "name",
"version": "1.01.01",
"scripts": {
...
},
"dependencies": {
...
},
...
}
I mean to add something like:
"directory": {
"my-library": "./src/path/to/my/lib"
}
Thank for any help.
According to the documentation you can define your local directories as dependencies in the following format:
{
"name": "baz",
"dependencies": {
"bar": "file:../foo/bar"
}
}
You can read more here: https://docs.npmjs.com/files/package.json#local-paths

Webdriver io autocomplete in VS Code

I'm using Webdriver IO as the e2e testing framework. But this autocomplete issue is really slowing me down. VS Code doesn't auto complete the global variable browser and it's methods.
.eslintrc
{
"extends": ["eslint:recommended", "standard"],
"parser": "babel-eslint",
"plugins": [
"mocha",
"webdriverio"
],
"env": {
"webdriverio/wdio": true,
"mocha": true
},
"parserOptions": {
"ecmaVersion": 8,
"sourceType": "module"
},
"rules": {
"indent": ["error", 4]
}
}
.babelrc
{
"presets": ["es2015"],
"plugins": [
["transform-runtime", {
"polyfill": false
}]
]
}
I think you can use TypeScript typings.
Add 2 dependencies to package.json:
"#types/node": "^8.5.2",
"#types/webdriverio": "^4.8.7",
Install them, reload project. If autocomplete does not yet works, create
tsconfig.json in root of your project:
{
"compilerOptions": {
"allowJs": true,
"outDir": "./.built/"
}
}
You don't need to use typescript compiler, it will just provide autocomplete. Continue writing your js code as usual.
But if you wish to use typescript, here is small beginner guide:
http://webdriver.io/guide/getstarted/configuration.html#Setup-TypeScript

Grunt concat all package.json dependencies

This is the first time I use grunt & npm.
My package.json contains this:
"dependencies": {
"angular": "latest",
"bootstrap": "latest",
"jquery": "latest"
}
Is there a way to tell grunt: "Look at all of my dependencies, load the right files, and create one JS file, and one CSS file for distribution"?
*This is because I don't want to list all of the distribution files for every dependency.
yes you can use grunt modules like: concat, cssmin, and sass, for concat your files in just 1.
I will try give a small explanation, but you can read more and understand using the links.
concat:
https://www.npmjs.com/package/grunt-contrib-concat
cssmin:
https://github.com/gruntjs/grunt-contrib-cssmin
sass:
https://github.com/gruntjs/grunt-contrib-sass
on package json:
insert this dependencies:
"grunt-contrib-concat": "*",
"grunt-contrib-cssmin": "*",
"grunt-contrib-uglify": "*",
"grunt-contrib-uglify": "*",
on gruntfile.js insert these blocks bellow:
load the tasks:
var tasks = [
,'grunt-contrib-concat'
,'grunt-contrib-uglify'
,'grunt-contrib-sass'
,'grunt-contrib-cssmin'
];
for css min:
cssmin: {
target: {
files: [{
expand: true,
cwd: 'release/css',
src: ['*.css', '!*.min.css'],
dest: 'release/css',
ext: '.min.css'
}]
}
}
for Concat :
var concat
config.concat = concat = {};
concat.dev = {
files: {
"public/myapp.development.js": [
"with-bootstrap/public/js/vendor"
,"with-bootstrap/public/js/**/*.js"
]
}
};
for uglify:
config.uglify = {dist: {
options: {sourceMap:"public/myapp.production.js.map"}
,files: {
"public/myapp.production.js": ["public/myapp.development.js"]
}
}}
I hope this helped you.