Require highcharts-browserify to use specific version of highcharts? - javascript

I'm working with highcharts-browserify. This is what my package.json file looks like:
{
"main": "index.js",
"scripts": {
"watch-index": "watchify index.js -o ../../static/js/index.js --debug --verbose",
"watch": "npm run watch-index",
"build-index": "browserify index.js | uglifyjs > ../../static/js/index.min.js",
"build": "npm run build-index"
},
"dependencies": {
"highcharts-browserify": "^0.1.5-4.1.7",
"jquery": "^1.11.3",
}
}
However, when I run npm run watch, the compiled file has v4.0.4 of Highcharts in it, not the latest version (v4.1.7).
How can I make sure I've got the latest version?
I need to use the latest version because of this bug in x-axis labels in v4.0.4 of Highcharts: http://jsfiddle.net/5z8rf83y/7/

The highcharts-browserify library currently uses v 4.0.4.
https://github.com/soldair/highcharts-browserify/blob/master/highcharts.js#L2
You could open a ticket to have it updated, or fix it and submit a pull request.
Also, you can by pass using this library, and use browserify-shim which would look like this -
{
"browserify": {
"transform": [
"browserify-shim"
]
},
"browserify-shim": {
"Highcharts": {
"depends": ["HighchartsAdapter:HighchartsAdapter"],
"exports": "Highcharts"
},
"HighchartsAdapter": {"exports":"HighchartsAdapter"}
},
"browser": {
"Highcharts": "./bower_components/highcharts-release/highcharts.src.js",
"HighchartsAdapter": "./bower_components/highcharts-release/adapters/standalone-framework.src.js"
}
}

Related

Why won't my breakpoints get hit in Visual Studio Code

I'm trying the get the Visual Studio Code debugger working in my angular/typescript application but it's not working.
Here's what I have:
.vscode/launch.json
{
"version": "0.2.0",
"configurations": [
{
"name": "Debug node",
"port": 9229,
"request": "attach",
"skipFiles": [
"<node_internals>/**"
],
"localRoot": "${workspaceFolder}\\.dist",
"remoteRoot": "/usr/src/api/.dist",
"type": "node"
}
]
}
scripts/local-entry-point.sh
#!/usr/bin/env sh
set -e
echo "STARTING local-entry-point.sh"
FOLDER=/tmp/.dist
if [ ! -d "$FOLDER" ]; then
mkdir /tmp/.dist
fi
false | cp -ir ${FOLDER} /usr/src/api/ 2>/dev/null
rm -rf ${FOLDER}
cd scripts
npm run watch
scripts/package.json
{
"private": true,
"devDependencies": {
"#effect-ts/core": "^0.11.1"
},
"scripts": {
"watch": "nodemon --watch '/usr/src/api/.dist/**/*' -e ts,json,js -x npm run debug",
"debug": "node --inspect=0.0.0.0:9229 /usr/src/api/.dist/start.js"
}
}
docker-compose.yml
...
ports:
- 4002:8800
- 9229:9229
...
I put breakpoints in both my Typescript and the compiled Javascript in the .dist folder (on the corresponding line):
I start my application (npm run docker), start the debugger in vscode, go through the steps to run the code, but the breakpoints don't get hit.
Seems like you are using Typescript. AFAIK VSCode debugger needs a sourcemap to put breakpoints on ts projects. I think this doc might help https://code.visualstudio.com/docs/typescript/typescript-debugging

after the command "npm start" I do not see changes in the console, as if the code is not being updated on the fly. JS

after the command "npm start" I do not see changes in the console, as if the code is not being updated on the fly.
{
"scripts": {
"format": "prettier --write app",
"start": "http-server"
},
"dependencies": {
"http-server": "^14.1.0"
},
"devDependencies": {
"prettier": "^2.0.5"
}
}
My version of node: 7.11.1
i have a macbook
What can I do ?
Thank you
Node do not automatically restart after changes :)
You should use eg. nodemon:
https://www.npmjs.com/package/nodemon
npm i nodemon --dev
Then start your app like that:
nodemon index.js
donnot reload your page.
you can use eg. nodemon: https://www.npmjs.com/package/nodemon
Thank you for your help, but it still doesn't go ... I installed a nodemon. {
"scripts": {
"format": "prettier --write app",
"start": "http-server"
},
"dependencies": {
"http-server": "^14.1.0"
},
"devDependencies": {
"nodemon": "^2.0.16",
"prettier": "^2.0.5"
}
}
then I have to in the console: nodemon game.js ?

Editing package.js file

i'm having a hard time to understand how to run all of my .js files using package.js files
i have almost 2000.js scripts i need to run them one by one, i'm using a api made by gameflip
in the folder i found package.js, but i don't know how to use it ,
can anyone tell me how to do that ? thank you
here the script :
{
"name": "gfapi",
"version": "0.1.1",
"description": "Gameflip API",
"keywords": "Gameflip",
"homepage": "https://github.com/iJJi/gfapi",
"bugs": "https://github.com/iJJi/gfapi/issues",
"author": {
"name": "Eng-Shien Wu",
"email": "engshien.wu#ijji.com"
},
"license": "MIT",
"private": true,
"files": [
"index.js"
],
"repository": "iJJi/gfapi",
"engines": {
"node": ">=8.5.0"
},
"scripts": {
"bulk_listing": "node src/samples/bulk_listing.js",
"test": "ENVIRONMENT=mocha mocha src/test --recursive",
"docs": "jsdoc -c jsdoc_conf.js -d docs -P package.json index.js; docco -o docs/samples src/samples/*.js src/samples/*.rb"
},
"dependencies": {
"base-64": "^0.1.0",
"bluebird": "^3.5.0",
"bunyan": "^1.8.12",
"file-type": "^8.1.0",
"http-errors": "^1.6.2",
"node-rest-client-promise": "^3.1.1",
"promise-ratelimit": "^0.0.3",
"request": "^2.85.0",
"request-promise": "^4.2.2",
"speakeasy": "^2.0.0"
},
"devDependencies": {
"marked": "^0.3.19",
"docco": "^0.7.0",``
"jsdoc": "^3.5.5"
}
}
What you posted isn't a package.js (I don't even know if it exists), but a package.json. It's generated by NPM, the Node Package Manager. It's a list of all the project's dependencies. I think that what you're looking for are the npm scripts, they are in the script object of package.json.
npm run <script>
# For example :
npm run bulk_listing
npm run test
npm run docs
Each script will run its associated command in this package.json.
npm run bulk_listing
# Will do the same thing as:
node src/samples/bulk_listing.js
More about package.json.
The script I talked about below
If you want to run all the scripts, this should do the job :
const fileNames = ["path/to/fileA", "fileB"]; // I assume you have something to get all the files path. Isn't that npm run bulk_listing ?
fileNames.forEach(async (path, index) => {
// It's pretty much like 'node <path>'
await require(path);
// All the code here is executed AFTER the script has been launched
console.log(`LAUNCHED ${index} | ${path}`)
});

webpack + babel not bundling the js properly

I am using webpack and babel in my project. While the webpack is wokring fine but babel is somehow not doing it's job in polyfilling the ES6+ features. When I use the npm script, I get some error "Entrypoint undefined = index.html" in the command prompt. Kindly help !
Package.json
{
"name": "forkify",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "webpack --mode development",
"build": "webpack --mode production",
"start": "webpack-dev-server --mode development --open"
},
"author": "neeraj",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^8.0.2",
"babel-preset-env": "^1.7.0",
"html-webpack-plugin": "^3.2.0",
"webpack": "^4.19.0",
"webpack-cli": "^3.1.0",
"webpack-dev-server": "^3.1.8"
},
"dependencies": {
"babel-polyfill": "^6.26.0"
}
}
webpack.config.js
const path=require('path');
const HtmlWebPackPlugin=require('html-webpack-plugin');
module.exports={
entry:['babel-polyfill','./src/js/index.js'],
output:{
path:path.resolve(__dirname,'dist'),
filename:'js/bundle.js'
},
devServer:{
contentBase:'./dist'
},
plugins:[
new HtmlWebPackPlugin({
filename:'index.html',
template:'./src/index.html'
})
],
module:{
rules:[
{
test:/\.js$/,
exclude:/node_modules/,
use:{
loader:'babel-loader'
}
}
]
}
};
.bablerc
{
"presets":[
["env",{
"targets":{
"browser":[
"last 5 versions",
"ie>=8"
]
}
}]
]
}
Error what I get:
Project Structure:
EDIT------------------
I started getting some new error now.
It is the html-webpack-plugin's problem, a fix was introduced in
3.0.7 but was removed again in 3.0.8. For more information, please click here.
So if you run npm install --save-dev html-webpack-plugin#3.0.7, and then npm run dev will output Entrypoint html-webpack-plugin for "index.html" = index.html. And personally, it is a trivail problem not that important.
There was some dependency issue. Deleted my node_modules folder and used this command instead: npm install -D babel-loader#7 babel-core babel-preset-env webpack
Follow this link for more information : https://github.com/babel/babel-loader
Now I no longer get any error and also babel is working fine.
FYI....you might have to install babel-polyfill & html-webpack-plugin seperately.

Meteor import directory test files not eagerly loading

Meteor version 1.7.0.5
Using meteortesting:mocha
I have a very simple meteor react app. I added a test file in imports/startup/simple-schema.tests.js
describe('Todos_item', function () {
console.log('Todo');
});
I was running npm run test-app so it should be logged in console but that file actually doesn't run. But when I added this snippet to my tests/main.js Todo is logged in console. So am I missing something.
My directory tree
package.json
{
"name": "meteor-bootstrap",
"private": true,
"scripts": {
"start": "meteor run",
"test": "meteor test --once --driver-package meteortesting:mocha",
"test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
"visualize": "meteor --production --extra-packages bundle-visualizer"
},
"dependencies": {
"#babel/runtime": "7.0.0-beta.55",
"meteor-node-stubs": "^0.4.1",
"react": "^16.4.2",
"react-dom": "^16.4.2",
"react-router-dom": "^4.3.1",
"simpl-schema": "^1.5.3"
},
"meteor": {
"mainModule": {
"client": "client/main.js",
"server": "server/main.js"
},
"testModule": "tests/main.js"
},
"engines": {
"node": "8.11.4"
}
}
Any help will be greatly appreciated. Thanks in advance.
New Meteor apps since 1.7 have eager loading turned off by default (which is causing your problem)
The behaviour is controlled by the meteor section in your package.json.
To restore the eager loading behaviour for tests, delete the testModule key-value pair from your package.json. It should look like this:
"meteor": {
"mainModule": {
"client": "client/main.js",
"server": "server/main.js"
}
},
If you want to restore pre-1.7 behaviour for all files, just delete the whole meteor section from package.json
If you don't want to use eager loading, you will need to import all of your test files from the tests/main.js file
Also one thing to add when with #Fred answer importing test files have to use require not import though I am not sure is it due to my node version or not I am using my node version v6.11.1

Categories

Resources