NativeScript - How to prevent CSS minification? - javascript

I've got NativeScript 3.3.0 installed. My project-wide CSS is in app/app.css.
When I run the app, either by console
tns run android --device [device-ID of my preferred emulator]
or by starting it in an Android emulator through JetBrain's WebStorm (with NativeScript plugin installed), the app.css always gets minified during the rebuilding process after I do some changes to it while the app is running.
Is it somehow possibile to prevent NativeScript from minifying the CSS file upon building the app? I wished there was a run parameter with which I could toggle that.

Looks like you have nativescript-dev-sass installed
if you uninstall it, the minification should stop.
But ideally, you would want to keep the minification.
Edit:
you can do,
npm remove -D nativescript-dev-sass
and you remove those nativescript-dev-sass files which are in hooks folder (if it doesn't get removed automatically).
Also if you see node-sass in your devDependencies, remove that as well with
npm remove -D node-sass and you should be good to go. Cheers!

Related

Whenever I add a new cordova package to Meteor I get "Error: Variable(s) missing: REVERSED_CLIENT_ID"

Building an ios application from an existing Meteor package. I have been running the following in order to get the application to become an Xcode project:
meteor build ../example-output --mobile-settings settings-staging.json --server https://example-staging.meteorapp.com:443
I already have a mobile-config.js, which includes all the typical configurations for meteor such as App.info, App.icons, App.launchScreens, App.appendToConfig. In addition, I have the REVERSED_CLIENT_ID included in the file. Everything works fine, until I add any cordova plugins (meteor add plugin cordova: etc.)
App.configurePlugin("cordova-plugin-googleplus", {
REVERSED_CLIENT_ID: "com.googleusercontent.apps.010101010-bexamples123"
});
The application builds into a .xcworkspace but then has issues which I think these cordova plugins will fix. How can I configure/fix the REVERSED_CLIENT_ID and/or config issues and add cordova plugins so that this project can compile to an Xcode .xcworkspace?
Thanks to this Github post, which pointed out that
"This problem exists since 1.2.x. It sometimes happens if a Cordova
package references another Cordova package as a dependency. I had this
problems a lot with the cordova-plugin-compat package which is
referenced by some others."
The solution ended up being to simply remove the cordova build:
rm -rf .meteor/local/cordova-build
I also removed and added the iOS platform again for good measure:
meteor remove-platform ios
meteor add-platform ios

Meteor build packages not included

I am currently trying to generate native versions of a small meteor app I built. When I run them on iOS or Android via the meteor run command it works and meteor build with --debug also generates an ipa/apk that works as expected. But when I run meteor build without --debug the web view only shows a white screen. Using remote debugging I noticed an injector error. I was wondering why and checked the apk/ipa content. There I recognized that in the debug version under assets/www/application/packages there is a bunch of .js and .js.map files which simply is not there in the non-debug ipa/apk.
In the index.html of the non-debug ipa/apk the imports of these files are also missing.
How can I tell meteor to just copy these obviously required files for non-debug?
When you build, Meteor concatenates and minifies all the JS files into a single bundle, same as Browserify and webpack are doing. That is why you do not see all the script imports.
It does not do it in debug to facilitate live reload / hot code push while you are developing, besides facilitating debugging​ obviously.
See the Meteor guide on building for production.
If you believe this difference causes some issue, you can simulate it in development using the --production flag after meteor run.
This addresses your titled and last question, but may not fix in itself your initial issue.

React native - which files to include in version control after installing native-base?

I started react-native project, and decided to test native-base library. Installing it and its dependencies resulted in changes to both ios and android folders. I'm not sure should I put these changes to version control or not?
The changes were:
ios:
ios/AppName.xcodeproj/project.pbxproj: I see hashes with fonts added
ios/AppName/Info.plist: Fonts are added here too inside tags
android:
android/app/src/main/assets/fonts/[20 different fonts]
So apparently, installing react-native native-base resulted in getting some fonts to the native folders? The best practise standard .gitignore files for react-native projects does not ignore these files, hence my version control client is showing the files to me. But I wonder if all of those changes were made only because of installing some third party libraries, then should I put them to version control? As the peer coders will also install those, and they should get the same files, right?
What I worry is that some important files in the native directory will become unsynced between the developers of this project. If they install the native-base, and it results in change for some core files in ios side, then that change might not be exactly the same (for example, there might have been minor version update etc.). I don't really know what to do, please help!
Apparently a very similar issue has came up for others too.
One possible solution is to check, whether it's a compatibility issue and downgrade React Native for start.
The other potential solution might be is to reinstall React Native with NPM:
npm install react-native --save
If this doesn't help, try again, but before installing React Native with NPM, remove package-lock.json and the node_modules directory (on Linux):
rm -rf package-lock.json node_modules
If you use Yarn, try to use NPM instead and see whether this resolves your problem.

run 'watch' before serve- node ionic2

I am working with ionic 2. And I don't know why when I'm trying to run 'ionic serve', it answer with the next messeges:
WARN: ionic.config.js has been deprecated, you can remove it.
WARN: No 'serve:before' gulp task found!
Your gulpfile contains a 'watch' task already! Add:
gulp.task('serve:before', ['watch']);
to your gulpfile to have Ionic CLI run 'watch' before serve.
WARN: ionic.config.js has been deprecated, you can remove it.
In the gulpfile.js I add that line and it works, but when I change some html file it don't update. I have to stop serve. And run the command again.
PD: I have alredy install all dependencies with npm install
Thanks
Recently Ionic updated their CLI tool (to beta.21). They have obviously made some changes in the gulp file which is being generated by their newly updated CLI. The project you are trying to run was created using an older version of CLI (probably beta.19). That's why you are getting that warning. Regarding the 'ionic.config.js has been deprecated' line, that file is simply a checkpoint to see whether you are using the latest version of Ionic CLI.
There is a quick fix (which I did).
1) Create a new ionic app (possibly using the same template as the one you are trying to run i.e., blank or sidemenu or tabs).
2) Copy the contents of the app directory of the project which you are trying to run to the app directory of the newly generated project.
(I don't know whether this is the right method, but this will work.)
Hope this helps you. Thanks.

How do I install Meteor Atmosphere packages locally so I can make modifications to it?

I am trying to get up and running with Meteor and seeing what it can offer, while I like it overall, it seems it's a very very rigid system.
I set up a small testing setup using Velocity, it opens a small overlay window on the side which has a class of "velocityOverlay". The overlay is really small and makes error stack traces wrap. All I wanted to do was to edit the css of the "velocityOverlay" and increase the width.
I somehow (after wasting time) managed to find that Meteor is actually putting all the packages in my user directory by default, once I found that, I found the needed css file...
velocity_html-reporter/.0.5.1.aykpxq++os+web.browser+web.cordova/web.browser/packages/velocity_html-reporter/lib/client-report.less.css
And I did a small edit to the width, next thing you know the meteor app crashes when trying to launch using the "meteor" command throwing a "Error: couldn't read entire resource" error. I can't even edit the bootstrap.css file I installed using "ian_bootstrap-3".
Further more, I can't find any way to install packages locally just for my particular project, what if I wanted to modify a package only for my particular project? this is very easy to do in vanilla Node.js, you simply don't use the "-g" when using "npm install".
To add to that, within my project root, there is another ".meteor/local/build/web.browser" folder with most of the global package files replicated again. When does Meteor use which? This is very confusing.
You can run a package locally very easily.
Download it from Github (for example) and put it in the packages/ directory of your application like this /packages/package_name.
Then add it to your application with the same meteor add package_name command as usual.
Meteor will automatically look in the local folder before anywhere else and compile the package with the rest of your code.
This allows you to do any modification you want on the package and test it locally before publishing it to the registry.
Also, folders located in .meteor/local/* are used for building purpose only and are generated automatically by Meteor. So it is not the best place to edit the files!
This worked for me https://atmospherejs.com/i/publishing. mrt link-package didn't work for me, might just be outdated code.
Steps:
Download (or clone) package from GitHub to local dir
Stop meteor if running
2.1. Make sure you have a packages folder: mkdir packages
Locally link your package:
3.1 If you have mrt installed: Run mrt link-package /path/to/package in a project dir
3.2 If you don't have mrt: ln -s /path/to/package packages/package
Then run meteor add developer:package-name, do not forget to change package name
Run meteor in a project dir
From now any changes in developer:package-name package folder will cause rebuilding of project app
Download the package and place it in new package directory in your project root.
open the package.js inside the downloaded package and remove the author's name in the property "name:"
e.g: - name:'dburles:google-maps' to name:'google-maps'
then run
meteor add google-maps

Categories