We Keep Coding

Cube.js Playground: Error while loading DB schema

I am currently learning Javascript/HTML/CSS in order to build some data dashboard.
I have found this tutorial https://d3-dashboard.cube.dev/setting-up-a-database-and-cube-js
Currently I am getting stuck at this part:
The next step is to create a Cube.js data schema.
When opening the Cube.js playground at: http://localhost:4000, I get the following output in my terminal:
🦅 Dev environment available at http://localhost:4000, I get the following error:
🚀 Cube.js server (0.21.1) is listening on 4000
Error: getaddrinfo ENOTFOUND <YOUR_DB_HOST_HERE>
at GetAddrInfoReqWrap.onlookup [as oncomplete] (dns.js:66:26)
And in the Cube.js playground webpage view:
Error while loading DB schema
Error: getaddrinfo ENOTFOUND <YOUR_DB_HOST_HERE> at
GetAddrInfoReqWrap.onlookup [as oncomplete](dns.js66:26)
I have edited the following file:
d3-dashboard/node_modules/#cubejs-backend/server-core/core/index.js
, with:
const checkEnvForPlaceholders = () => {
const placeholderSubstr = '<YOUR_DB_';
const credentials = [
'CUBEJS_API_SECRET=SECRET',
'CUBEJS_DB_TYPE=postgres',
'CUBEJS_DB_NAME=ecom',
'CUBEJS_WEB_SOCKETS=true'
/*'CUBEJS_DB_HOST',*/
/*'CUBEJS_DB_NAME',*/
/*'CUBEJS_DB_USER',*/
/*'CUBEJS_DB_PASS'*/
];
Any input on what I am doing wrong here?
I am totally new to apps and front-ends, so it might be something "stupid" that I am sking, but I really would like to learn from my mistakes :)
Thank you for your time and potential inputs/help!
Have a great day :)

You definitely should not edit any files in the node_modules directory. You should store the env variables in the .env file.
-your-cubejs-server-root
--schema
--.env
--//..
And it may look like
CUBEJS_DB_HOST=localhost
CUBEJS_DB_NAME=cubejs
CUBEJS_DB_USER=root
CUBEJS_DB_PASS=
CUBEJS_DB_TYPE=mysql
CUBEJS_API_SECRET=secret
The error you're getting is saying that the connection to the DB cannot be established. Because you're missing the proper CUBEJS_DB_HOST= variable.
The minimum required set of variables differs for each database and can be found here https://cube.dev/docs/connecting-to-the-database

Error while initializing app TypeError: parentVal.concat is not a function

I created a fresh Nuxt.js project: npx create-nuxt-app project
Then I launch the server: cd project && npm run dev
Till this point is all ok.
Now I want to install nuxt-i18n: npm i nuxt-i18n and then I added it in nuxt.config.js:
modules: [
['nuxt-i18n', {
// Options
}]
I am getting the following error in the console of the development tools (with a page showing blank):
app.js:455 [nuxt] Error while initializing app TypeError: parentVal.concat is not a function
at mergeHook (commons.app.js:11924)
at mergeField (commons.app.js:12185)
at mergeOptions (commons.app.js:12176)
at Vue._init (commons.app.js:15301)
at new Vue (commons.app.js:15419)
at _callee5$ (app.js:1317)
at tryCatch (commons.app.js:5854)
at Generator.invoke [as _invoke] (commons.app.js:6088)
at Generator.prototype.(:3000/anonymous function) [as next] (http://localhost:3000/_nuxt/commons.app.js:5906:21)
at asyncGeneratorStep (commons.app.js:33)
What causes this and how to fix it?

It seems due to a sub dependency issue from vue-meta used by vue-i18n
(see the open issue https://github.com/nuxt-community/nuxt-i18n/issues/127)
as workaround, try to set the seo option at false :
// nuxt.config.js
['nuxt-i18n', {
seo: false
}]

It was due to vue-meta. Vue-meta 1.5.5 was released that is fixed this issue.
So you can update it and it will fine

Circular references in Webpack build of kurento-client-js

I'm facing an error while trying to build kurento-client-js with Webpack 2 + babel.
WARNING in ./node_modules/kurento-client/lib/register.js
60:20-33 Critical dependency: the request of a dependency is an expression
On execution it results in
Uncaught Error: Cannot find module "."
I believe that the issue itself is сaused by require inside /lib/register.js
//kurento-clinet/lib/register.js
if (constructor == undefined)
return register(require(name));
And the code that cause errors:
//kurento-clinet/lib/index.js
//this module requires kurento-client resulting in circular reference
register('kurento-client-core')
The kurento bower package contains distributive built with the browserify.
I wonder if anyone tried to build kurento-client-js using webpack. Please share your experience.
EDIT:
Circular dependency error stack trace:
Uncaught TypeError: Cannot read property 'MediaObject' of undefined
at Object._typeof (KurentoClient.js:42)
at __webpack_require__ (bootstrap 0d7eac46304670c5f3b5:19)
at Object._typeof (index.js:44)
at __webpack_require__ (bootstrap 0d7eac46304670c5f3b5:19)
at Object.module.exports (HubPort.js:21)
at __webpack_require__ (bootstrap 0d7eac46304670c5f3b5:19)
at Object._typeof (index.js:32)
at ...

First of all webpack complains about a dynamic dependency (which cannot be resolved when building the bundle). It's not a circular dependency.
I got it working like this:
1) in your app's main.js require manually all the modules which the register() function might need
require('kurento-client-core')
require('kurento-client-elements')
require('kurento-client-filters')
const kc = require('kurento-client-core/lib/index.js')
console.log(kc)
2) use this webpack plugin to completely ignore unresolved/dynamic require() calls
//in webpack.config.js
plugins:[
function() {
this.parser.plugin('call require', function(expr) {
if (expr.arguments.length !== 1) {
return;
}
const param = this.evaluateExpression(expr.arguments[0]);
if (!param.isString() && !param.isConditional()) {
return true;
}
});
}
//... other plugins
]
Webpack2 will warn about old plugin format, but it does work
Credits go to:
https://stackoverflow.com/a/42527120/646156

Updated to Angular 1.3.0 no longer working

I am using Browserify to wrap everything up. I have just upgraded from 1.2.23 to 1.3.0 and am now getting the following errors:
Firefox Error
TypeError: angular.module is not a function
var app = angular.module('login-Controller', ['Views']);
----------^
Clearly says that angular is not defined. So I outputed the output from angular
var angular = require('angular'),
console.info(angular); // Object {} ='s an empty object
Does this mean that angular is no longer compatible with browserify? If it is, how can I get it working?
Detailed Error from Chrome
Uncaught TypeError: undefined is not a function main.js:25868 C:\var\www\stage.mayfieldafc.com\src\site\js\users\loginCntrl.js.angularmain.js:1 smain.js:1 (anonymous function)main.js:28 ./src/site/js/app.js.angularmain.js:1 smain.js:1 emain.js:1 (anonymous function)
main.js:183 Uncaught Error: [$injector:modulerr] Failed to instantiate module mays due to:
Error: [$injector:nomod] Module 'mays' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
http://errors.angularjs.org/1.3.0/$injector/nomod?p0=mays
at http://localhost:3000/js/main.js:183:12
at http://localhost:3000/js/main.js:1900:17
at ensure (http://localhost:3000/js/main.js:1824:38)
at module (http://localhost:3000/js/main.js:1898:14)
at http://localhost:3000/js/main.js:4167:22
at forEach (http://localhost:3000/js/main.js:438:20)
at loadModules (http://localhost:3000/js/main.js:4151:5)
at createInjector (http://localhost:3000/js/main.js:4077:11)
at doBootstrap (http://localhost:3000/js/main.js:1587:20)
at bootstrap (http://localhost:3000/js/main.js:1608:12)
http://errors.angularjs.org/1.3.0/$injector/modulerr?p0=mays&p1=Error%3A%20…at%20bootstrap%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Fmain.js%3A1608%3A12)main.js:183 (anonymous function)main.js:4190 (anonymous function)main.js:438 forEachmain.js:4151 loadModulesmain.js:4077 createInjectormain.js:1587 doBootstrapmain.js:1608 bootstrapmain.js:1502 angularInitmain.js:25682 (anonymous function)main.js:2845 triggermain.js:3116 eventHandler
Markup
html(ng-app='mays)

As mentioned by #JeffB, you can use browserify-shim to (hopefully temporarily) remedy this problem.
First, npm install --save-dev browserify-shim. Then, add the following to your package.json:
"browserify": {
"transform": [
"browserify-shim"
]
},
"browser": {
"angular": "./node_modules/angular/angular.js"
},
"browserify-shim": {
"angular": "angular"
}
This should then let you require and access Angular as expected.

The problem is that angular haven't updated their npm packages to be compatible with browserify just yet.
My fix was disgusting but its working. I simply downloaded v1.3.0 and pasted it into:
node_modules\angular\lib\angular.min.js
Now browserify will compile and use the latest version. This I hope is a temporary fix until they update the package.

It looks like you're defining the module name to be 'login-Controller' in your script, but calling it 'mays' in your markup. I would expect to see something like this:
//declare app in main.js
angular.module('name-of-app', [<modules>])
<!-- call your app in markup -->
<html ng-app="name-of-app"></html>
//jade
html(ng-app='name-of-app')

Sencha touch production build errors

Using touch 2.1.0 and Cmd 3.1.2.342
Whilst trying to create a production version of my sencha app, I get the following error:
[WRN] C1003: Unsupported Ext.define syntax -- C:\wamp\www\touch-2.1.0\axis\nativ
e\appname\touch\src\fx\TimingFunctions.js:109
[ERR] C2008: Requirement had no matching files (Ext.fx.TimingFunctions) -- C:\wa
mp\www\touch-2.1.0\axis\native\appname\touch\src\fx\Abstract.js:959
[ERR] The following error occurred while executing this line:
C:\wamp\www\touch-2.1.0\axis\native\appname.sencha\app\build-impl.xml:165:
It seems to me that it is saying a file called fx/TimingFunctions.js is required by fx/Abstract.js but cannot be found. However, this can't be what it means as the file exists in that folder.
The command I am using is:
sencha app build production
Line 109 of TimingFunctions.js looks like this:
Ext.define('Ext.fx.TimingFunctions', Ext.apply({
singleton: true,...
One solution is to change line 109 of TimingFunctions.js from:
Ext.define('Ext.fx.TimingFunctions', Ext.apply({
to:
Ext.define('Ext.fx.TimingFunctions', {
and change line 136 of the same file from:
}, EasingPrototype));
to:
}, EasingPrototype);
This then allows the build to go ahead.
However, when I then view the production app in the web browser, it freezes and I get the following error
Uncaught TypeError: Object # has no method 'call' process sencha-touch-all-debug.js:6767
(anonymous function) process sencha-touch-all-debug.js:6774
(anonymous function) sencha-touch-all-debug.js:6779
Ext.apply.onBeforeCreated sencha-touch-all-debug.js:5196
process sencha-touch-all-debug.js:5262
process sencha-touch-all-debug.js:5268
process sencha-touch-all-debug.js:5268
process sencha-touch-all-debug.js:5268
Ext.apply.process sencha-touch-all-debug.js:5272
Ext.Class.ExtClass sencha-touch-all-debug.js:5183
Ext.ClassManager.create sencha-touch-all-debug.js:6725
Ext.apply.define sencha-touch-all-debug.js:7407
(anonymous function) TimingFunctions.js?_dc=1379403994382:109
(anonymous function) TimingFunctions.js?_dc=1379403994382:138

There was a spelling mistake in the files fx/Abstract.js and fx/TimingFunctions.js
Actually, it's not a spelling mistake - more like a grammatical error.
Abstract.js calls a function in TimingFunctions.js. in Abstract.js it is referred to as EasingMap, where as in TimingFunctions.js it is called easingMap