I am working with Sencha Touch application with different packages with consequent scss files, these files are imported in the app.scss but when the sencha CMD is listening (with the command "sencha app watch") changes are not refreshed itself, I need to reset the command line to get the changes.
What am I doing wrong? or maybe is a bug?
Thanks!!
Have you added the package to your app.json file in the requires?
"resources": [
"resources/images",
"resources/icons",
"resources/splash",
"resources/fonts"
],
"ignore": [
".svn$"
],
"archivePath": "archive",
"requires": [
"package-name" <--- Here.
],
Related
I configured a Vue.js project with Electron using Electron Builder and I can1t debug it.
If I run my electron:serve script (which calls vue-cli-service electron:serve) in "Run and Debug" of VS it runs my app correctly, but sets the breakpoints of my main file (background.js), and any other, as unbound, as you can see in the image bellow:
I tried also to set launch.json with a "node.js electron main" config. But when I run debugger with this config it doesn't find the electron app at main.js, probably because main.js is a vue app.
{
"version": "0.2.0",
"configurations": [
{
"name": "Electron Main",
"program": "${workspaceFolder}/main.js",
"request": "launch",
"runtimeExecutable": "${workspaceFolder}/node_modules/.bin/electron",
"skipFiles": [
"<node_internals>/**"
],
"type": "node"
},
And if I exchange the main.js in this config to background.js it also doesn't find.
I set breakpoint at background.js line 13. And in main.js also.
I tried this config of launch.json also. Note that in cwd I have the path to my src folder, where I have the electron file, background.js, and stills it says that it did not find. I tried without the / after src also:
Here's my repository.
I'm trying to link a large number of font files into my react-native project and I don't want to do it manually because of how many there are.
Most instructions I've found say to do this:
package.json
"rnpm": {
"assets": ["assets/fonts"]
}
and then react-native link
The problem is I can't run react-native link without a second argument as it causes problems with some of the libraries I have installed.
Is there a way I can specify the command so it only links assets?
first edit your package.json
"rnpm": {
"assets": [
"./assets/fonts/"
]
}
then run
react-native link ./assets/fonts
source
I couldn't find a solution without running react-native link either. My solution was to commit everything, clean your stage, run react-native link, then check the git diff and remove the ones that is not your fonts. Works for me.
For example:
package.json
"rnpm": {
"assets": [
"./assets/Fonts/"
]
},
now you can use
react-native link
Here is what worked for me:
Create a configuration file react-native.config.js in the root project directory and add the code below:
module.exports = {
project: {
ios: {},
android: {},
},
assets: ['./assets/fonts'],
};
Then run npx react-native link
Here is the article: https://medium.com/#aravindmnair/add-custom-fonts-to-react-native-0-60-easily-in-3-steps-fcd71459f4c9
I have followed the steps outlined in the VS Code documentation for getting Intellisense working for React Native by installing typings for React Native. Now, what do I need to do to get autocomplete working? For instance, if I type <Text>, I would like to see an automatic closing of that tag. What am I missing here? This seems like it shuld work out of the box.
To enable IntelliSense (autocomplete) you have to install the official React Native Tools extension.
Installation
Open Command Palette by pressing F1, type ext install and press Enter, then look for React Native Tools extension.
Create a jsconfig.json file
You should create a jsconfig.json file in you root directory. It can be empty but must be present. The presence of such a file in a directory indicates that the directory is the root of a JavaScript project.
(Optional)
The file itself can optionally list the files belonging to the project, the files to be excluded from the project, as well as compiler options.
{
"compilerOptions": {
"target": "ES6",
"module": "commonjs",
"allowSyntheticDefaultImports": true
},
"exclude": [
"node_modules"
]
}
You can find more at https://code.visualstudio.com/docs/languages/javascript#_javascript-projects-jsconfigjson
Create a .babelrc file for ReactNative Packger transformer (optional, if you want to use TypeScript)
You should create a .babelrc file with sourceMaps = true and "presets": [ "react-native" ] for better source-mapping support. (required if you want TypeScript support).
{
"presets": [
"react-native" // this is required for debugging with react-native/packager/transformer
],
"plugins": [],
"sourceMaps": true // must be true react-native/packager/transformer using with node-module-debug
// because of some bugs from vscode-node-debug & vscode-react-native, "sourceMaps" cannot be "inline" or "both"
}
Install typings for React Native (optional)
To get IntelliSense for React Native, run npm install typings -g and then typings install dt~react-native --global in your terminal.
Hope this helps!!
React Native Tools in VSCode can't help you close the Tag after you typed<Text>,you can try to install Auto Close Tag and Auto Rename Tag
In my case, I have to copy jsconfig.json to tsconfig.json, close Visual Code and reopen it. Then it works properly.
jsconfig.json
{
"compilerOptions": {
"allowSyntheticDefaultImports": true
},
"exclude": [
"node_modules"
]
}
tsconfig.json
{
"compilerOptions": {
"allowJs": true,
"allowSyntheticDefaultImports": true
},
"exclude": [
"node_modules"
]
}
I am also not getting any IntelliSense and also package auto-import is not working. Since I am not using Typescript, deleting the tsconfig.json helped me.
Take backup of your tsconfig.json file first
In my case, I've already installed many react-native extensions for autoSuggestion and another helper extension, e.g. "React Native Tools", and "React-Native/React/Redux snippets for es6/es7"
Issues:
autoSuggestion keywords not coming while typing.
command(in IOS) + click not letting me to jump on the target files.
Recently I have seen in VS Code editor for new React-native applications autoSuggestion not working.
Steps I have followed to solve:
Go to Extensions
Search for React or React-native
Remove the installed extension
Reload it.
I am new to Aurelia and falling at the first hurdle.
I have created a new project using the aurelia cli and have selected to use less.
This works fine until I try to use bootstrap. I have installed bootstrap with npm which appears in node_modules/bootstrap/
This has the directory structure
dist fonts grunt Gruntfile.js js less LICENSE package.json README.md
There are css files in the dist directory.
In my template I do
The error I get is
Unhandled rejection Error: Failed loading required CSS file: bootstrap/css/bootstrap.css
How do I tell Aurelia where the bootstrap css files are and how to use them ?
Thanks
I found out one simple thing. Every time you modify aurelia.json file, you need to terminate au run --watch task, a start it again, and it will just work.
I did not find this in documentation.
Hope this helps.
There is solution for bootstrap downloaded from npm:
app.html:
<require from="bootstrap/css/bootstrap.css"></require>
package.json you have to add:
"overrides": {
"npm:jquery#^3.0.0": {
"format": "amd"
}
}
aurelia.json (aurelia_project folder) you have to add at the end of "app-bundle.js" bundle:
"dependencies": [
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": ["jquery"],
"exports": "$",
"resources": [
"css/bootstrap.css"
]
}
]
It should look like this:
"bundles": [
{
"name": "app-bundle.js",
"source": [
"[**/*.js]",
"**/*.{css,html}"
],
"dependencies": [
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": ["jquery"],
"exports": "$",
"resources": [
"css/bootstrap.css"
]
}
]
},
It works for me.
We are still working on the CLI's ability to import libraries into a project and configure them correctly for bundling. Remember, it is an alpha. We will have major improvements coming for this in the future. In the mean time, remember that you can always use traditional techniques for including libraries if you aren't sure what to do. So, I would just include the style tag in your html page and a script tag as well, just pointing at the location for the files in your packages folder.
This is a major use case for us, we just haven't worked out all the library import capabilities yet. We will address this soon.
Using Aurelia CLI
First, install the following in your project:
au install jquery#2
au install bootstrap
Second, in aurelia.json add this line in bundles:vendor-bundle.js
"jquery",
{
"name": "bootstrap",
"path": "../node_modules/bootstrap/dist",
"main": "js/bootstrap.min",
"deps": [
"jquery"
],
"resources": [
"css/bootstrap.css"
],
"exports": "$"
}
Then Add the following fonts after dependecies
"copyFiles": {
"node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2": "bootstrap/fonts",
"node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.woff": "bootstrap/fonts",
"node_modules/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf": "bootstrap/fonts"
}
Third, After setting import/install. Now you can reference it inside your app.html
<require from="bootstrap/css/bootstrap.css"></require>
Or simply add it as a globalResources inside main.ts
aurelia.use
.standardConfiguration()
.feature('resources')
.globalResources('bootstrap/css/bootstrap.css');
For more information on au install/import check it here or adding library in bundles.
I found that I had to change the boostrap css path in app.html to the one expected for Bootstrap 4, per a comment on Aurelia Discourse:
from this:
<require from="bootstrap/css/bootstrap.css"></require>
to this:
<require from="bootstrap/dist/css/bootstrap.css"></require>
If you are here in July 2019, the answer by #davidjmcclelland is what worked for me. After installing bootstrap, simple include require from=bootstrap/dist/css/bootstrap.css> in your app.html. No configurations required.
I am facing difficulties in creating custom plugin in apache cordova and use in sencha touch 2.3.1. Where we have to define javascript interface is not mention in the documentation.
Depending on the cordova version you should not need to add it to Sencha Touch, if your plugman compatible plugin works correct, as it will be added with the cordova-plugin.js file.
But in case you are having trouble with that way you can add it insdie the app.json file.
"js": [
{
"path": "YourPluginJSFile.js",
"remote": true
},
{
"path": "cordova.js",
"remote": true
},