Setting up Sencha extjs project - javascript

I am attempting to set up a Sencha extjs 6 project. I would like to be able to have both the modern and classic packages available. I'm following this set-up tutorial, but am not finding it very helpful.
If my understanding is correct, I should be able to have one app that accessible as both a desktop and mobile site. This is great and works for the uncompiled path (my app is in the folder root/sencha) mysite.com/sencha. However, if access the root site it also gives me the uncompiled path instead of using the build app.js.
My index page is at root/layouts/index.html. My extjs app is in root/sencha.
The relevant parts of my app.json are:
...
"indexHtmlPath": "../layouts/index.html",
"production": {
"output": {
"page": {
"path": "../../../../layouts/index.html",
"enable": false
},
"appCache": {
"enable": true,
"path": "cache.appcache"
},
"microloader": {
"path": "microloader.js",
"embed": false,
"enable": true
}
},
"loader": {
"cache": "${build.timestamp}"
},
"cache": {
"enable": true
},
"compressor": {
"type": "yui"
}
},
"output": {
"base": "${workspace.build.dir}/${build.environment}/${app.name}",
"page": "index.html",
"manifest": "${build.id}.json",
"js": "${build.id}/app.js",
"appCache": {
"enable": false
},
"resources": {
"path": "${build.id}/resources",
"shared": "resources"
}
},
...

As pagep suggested you just deploy on your production server the content of the build/production directory and not the source code. That way you only deploy the minimized and compressed files (classic/app.js, classic/resources/YourApp.css, modern/app.js, modern/resources/YourApp.css, etc...).

Related

Not getting IntelliSense in Visual Studio Code for React Native

I am trying to code a React Native application in Visual Studio Code. But I found that the hint for React Native for Styles element didn’t show when I code. I already installed:
ES7+ React/Redux/React-Native snippets
React Native Tools
Simple React Snippets
Here is the example when I type flex. It is supposed to show a list of styles element related to flex but it didn’t. Is anyone know how to enable it? Here is a screenshot:
Here is my settings.json file
{
"java.home": "C:\\Program Files\\Java\\jdk1.8.0_211",
"java.help.firstView": "gettingStarted",
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"python.languageServer": "Default",
"workbench.editorAssociations": {
"*.ipynb": "jupyter-notebook"
},
"notebook.cellToolbarLocation": {
"default": "right",
"jupyter-notebook": "left"
},
"php.suggest.basic": false,
"php.validate.enable": false,
"emmet.excludeLanguages": [
"markdown",
"php"
],
"php.validate.executablePath": "C:/xampp/php/php.exe",
"php.debug.executablePath": "C:/xampp/php/php.exe",
"php.executablePath": "C:/xampp/php/php.exe",
"vs-color-picker.autoLaunch": true,
"liveServer.settings.CustomBrowser": "chrome",
"liveServer.settings.useLocalIp": true,
"liveServer.settings.port": 0,
"workbench.colorTheme": "Visual Studio Dark",
"git.confirmSync": false,
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"workbench.iconTheme": "material-icon-theme",
"editor.formatOnPaste": true,
"editor.formatOnType": true,
"editor.formatOnSave": true,
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascriptreact]": {
"editor.defaultFormatter": "esbenp.prettier-vscode",
},
"emmet.includeLanguages": {
"javascript": "javascriptreact",
"typescript": "typescriptreact",
},
}
I solved this problem by following this post:
VsCode Intellisense react native not working
Which is installing this npm package into your project. By entering this command inside the terminal window of your VS Code:
npm install --save #types/react-native
Thanks for the help!

How to setup Atom JS autocomplete?

I'm trying to get autocomplete suggestions from my Atom code editor. When I'm trying doc I expecting document and when I typing document.que I'm expecting Atom would show me .querySelector(). And it's doesn't happening. I've installed these packages to resolve the issue:
atom-ternjs
After that I still doesn't get autocomplete for doc or document. My -tern.project file looks like this:
{
"ecmaVersion": 6,
"libs": [],
"loadEagerly": [],
"dontLoad": [
"node_modules/**"
],
"plugins": {
"doc_comment": true,
"complete_strings": {
"maxLength": 15
},
"node": {
"dontLoad": "",
"load": "",
"modules": ""
},
"modules": {
"dontLoad": "",
"load": "",
"modules": ""
},
"es_modules": {}
}
}
So, how do you autocomplete JS in Atom? Interesting thing - notice if I create array and try array. then Atom gives me suggestions like .pop .push and others but why it doesn't give me a document. => .querySelector() and other for DOM manipulation.
My Atom config.cson:
"*":
core:
telemetryConsent: "no"
editor:
fontSize: 13
"exception-reporting":
userId: "bla-bla-bla"
"linter-ui-default":
showPanel: true
I found the answer. Need to activate:
Packages => Atom Ternjs => Configure Project => and here need to checkmark for Browser option.

JSDOC: Tutorial config conf.json having parsing error

I followed all the steps mentioned and still I get "Unexpected token ? in JSON at position 0" error when I have a conf.json file in my tutorials folder. If I remove the conf.json, it works perfect. But I need the conf.json.
I have a tutorials folder with .md files and a conf.json file which looks like this
{
"name_of_tutorial": {
"title": "Test Title"
}
}
and in my jsdoc.json file looks like this
{
"tags": {
"allowUnknownTags": true,
"dictionaries": ["jsdoc", "closure"]
},
"opts": {
"recurse": true,
"encoding": "utf8",
"destination": "./docs",
"readme": "./Content/tutorials/project_README.md",
"tutorials": "./Content/tutorials"
},
"source": {
"includePattern": ".+\\.js(doc|x)?$",
"excludePattern": "(^|\\/|\\\\)_"
},
"plugins": [
"plugins/markdown"
],
"templates": {
"cleverLinks": false,
"monospaceLinks": false,
"default": { }
}
}
Looks like there is a problem when reading the file and parsing it as json.
Can you help me fix it?

How can I run multiple tests in parallel with JS/nightwatchjs?

Can I execute multiple test cases in parallel through Nightwatch ?Is it Possible?
I am searching for ability of threading capability in java for parallel test case execution.
Also what do you guys think about moving from Selenium to Nightwatch?
You can see the thread for parallelism: nightwatchjs also take a look into parallel run
Nightwatch is using the same selenium webdriver protocol but with some extra additions.
Yes you can leverage the parallel mode of nightwatch js using following configuration:
test_workers: {
enabled: true,
workers: 'auto'
}
To execute tests in multiple browsers, you need to add the desired capabilities of the browsers and Test_worker configurations in nightwatch.json file.
For eg. if you want to use Opera you have to add this config:
"cli_args": {
//path to Opera Webdriver File
"webdriver.opera.driver": "bin/operadriver"
}
"opera": {
"desiredCapabilities": {
"browserName": "opera"
}
}
For Test_Worker Configuration you should add:
"test_workers": {
"enabled": true,
"workers": "auto"
}
For example if you want to execute tests in three browsers parallely - Chrome, Firefox and Opera, your nightwatch.json should something like this.
{
"src_folders": [
"tests"
],
"output_folder": "reports",
"selenium": {
"start_process": true,
"server_path": "bin/selenium-server-standalone-3.12.0.jar",
"log_path": "",
"port": 4444,
"cli_args": {
"webdriver.chrome.driver": "bin/chromedriver",
"webdriver.gecko.driver": "bin/geckodriver",
"webdriver.opera.driver": "bin/operadriver"
}
},
"test_workers": {
"enabled": true,
"workers": "auto"
},
"test_settings": {
"default": {
"launch_url": "http://localhost",
"selenium_port": 4444,
"selenium_host": "localhost",
"silent": true,
"screenshots": {
"enabled": false,
"path": ""
},
"desiredCapabilities": {
"browserName": "chrome"
}
},
"firefox": {
"desiredCapabilities": {
"browserName": "firefox",
"marionette": true
}
},
"opera": {
"desiredCapabilities": {
"browserName": "opera"
}
}
}
}
For more info, you can look into this article: How To Execute Tests In Multiple Browsers Parallely With NIGHTWATCH JS.

Vorlon.js is asking for Socket.io, but it's config is already set to include socket.io

I can see the server, but when I load the app I get a red div across the front that says:
Vorlon.js: please load socket.io before referencing vorlon.js or use includeSocketIO = true in your catalog.json file.
my terminal gives me the following output every time I load the server page:
{
"useSSL": false,
"SSLkey": "cert/server.key",
"SSLcert": "cert/server.crt",
"includeSocketIO": true,
"plugins": [
{ "id": "CONSOLE", "name": "Interactive Console", "panel": "bottom", "foldername": "interactiveConsole", "enabled": true },
{ "id": "DOM", "name": "Dom Explorer", "panel": "top", "foldername": "domExplorer", "enabled": true },
{ "id": "MODERNIZR", "name": "Modernizr", "panel": "bottom", "foldername": "modernizrReport", "enabled": true },
{ "id": "OBJEXPLORER", "name": "Obj. Explorer", "panel": "top", "foldername": "objectExplorer", "enabled": true },
{ "id": "XHRPANEL", "name": "XHR", "panel": "top", "foldername": "xhrPanel", "enabled": true },
{ "id": "NGINSPECTOR", "name": "Ng. Inspector", "panel": "top", "foldername": "ngInspector", "enabled": false },
{ "id": "NETWORK", "name": "Network Monitor", "panel": "top", "foldername": "networkMonitor", "enabled": true },
{ "id": "RESOURCES", "name": "Resources Explorer", "panel": "top", "foldername": "resourcesExplorer", "enabled": true }
]
}
(fourth line down, includeSocketIO is set to true).
Has anyone else had a similar issue (and hopefully been able to fix it)?
It looks like the problem comes from CORS errors. Socket.io doesn't have the right permission to write across domains. To fix the issue so I could open my app on my iPad, I did this:
Make sure the host address that you load the page from and the Vorlon script address are the same. e.g., for me, I am hitting http://mymachine.local/... on my iPad, and I set the Vorlon script URL to http://mymachine.local:1337/vorlon.js in my page. Instead of mymachine.local, this might be your local network IP (192.168.x.x).
I also had to load Vorlon as the first script in my page, before any other libraries.
If it's still not working, open your app in a second browser (I tested in FF with the Vorlon server open in Chrome) and check the console for CORS errors.
Hope this helps.

Categories

Resources