NativeScript empowers you to access native platform APIs from JavaScript directly. Angular, Capacitor, Ionic, React, Svelte, Vue and you name it compatible.

  • By NativeScript
  • Last update: Dec 30, 2022
  • Comments: 16

NativeScript

Build Status

NativeScript empowers you to access native APIs from JavaScript directly. The framework currently provides iOS and Android runtimes for rich mobile development and can be utilized in a number of diverse use cases.

Setup and Installation

Contribute

$ git clone https://github.com/NativeScript/NativeScript.git
$ cd NativeScript

# setup workspace for development
$ npm run setup

# list all available commands to run
$ npm start

We love you and your PR's 🤗 . Please follow our contributing guide and see our code of governance to become as involved as you want to be.

@nativescript/*

Quick Links

Other source repos

Outside the source centralized in this repo, NativeScript consists of a few other source repos. Here are the major ones:

  • iOS runtime
    • npm
    • This repo contains the NativeScript iOS runtime — the code that hosts NativeScript iOS apps, and allows JavaScript code to be executed on iOS devices. The iOS runtime is written in a fun mix of C++, Objective-C, and more.
  • Android runtime
    • npm
    • This repo contains the NativeScript Android runtime — the code that hosts NativeScript Android apps, and allows JavaScript code to be executed on Android devices. The Android runtime is written in a fun mix of C++ and Java.
  • CLI
    • npm
    • This repo contains the NativeScript command-line interface, which lets you create, build, and run apps using the NativeScript framework. The CLI is written in TypeScript.
  • Docs
    • Docs
    • This repo contains the NativeScript framework documentation, which is available at http://docs.nativescript.org/. The docs are written in Markdown.

License

License

Made with ❤️

Github

https://github.com/NativeScript/NativeScript

Comments(16)

  • 1

    Implement CSS Box Shadow

    Would be great to see a CSS3 style box shadow for UI elements.

    Possible implementation: box-shadow: none|h-shadow v-shadow blur spread color |inset|initial|inherit;


    Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

  • 2

    🚨 XCode 12 Status

    Update (09/27):

    We have released [email protected] with additional fixes for running on a real device.

    Details in this PR: https://github.com/NativeScript/ios-device-lib/pull/70

    Update (09/23):

    We have released [email protected] with fixes for running on a real device. This version reverted some changes from rc.0 - we expect this to run fine for both simulators and devices, however there may be other cases we need to take into account. Please try the latest RC (ideally revert manual changes in Podfiles, build configs etc and run ns clean) and if something isn't working, re-run with --log trace enable and share the logs with us.


    We released [email protected] that should allow building nativescript apps for the simulator using XCode12.

    Please try it

    npm i -g nativescript@rc
    

    And then cleaning your project (ns clean) and re-running it. The apps should build successfully, and deploy to the simulator(s). If this works for you, consider leaving a 👍 on this issue to let us know - and if it fails to build/run leave a comment with the output logs (re-run the build with --log trace to get more verbose logs).

    Known issues:

    • building with XCode 12 fails [Fix in RC]
    • deploying to an ios14 device (not simulator) gets stuck [Fix In RC1]
    • warning: The iOS Simulator deployment target 'IPHONEOS_DEPLOYMENT_TARGET' is set to 8.0 - this is a warning, that should not cause any issues with the build. If the build fails, it's likely related to another issue.
    • --release (and --env.production) not able to build the app. [Should Be OK in RC1]
    • running on a real device, the CLI cannot start/stop the app - the app has to be manually restarted. [Should be OK in RC2]
    • if you have a custom CFBundleName the cli will fail with No .ipa found in /.../platforms/ios/build/Debug-iphoneos directory.. [Looking into a fix]

    Related issues:

    • #8866
    • #8861
    • #8860
    • #8780
    • #8788
    • #8868
    • https://github.com/NativeScript/nativescript-cli/issues/5389
  • 3

    Move JS Processing to background thread or allow creation of other WebWorkers/Threads

    From what I understand everything runs on the primary thread. So this is a feature request -- but if done possible sooner would eliminate any later incompatibilities. Having the main thread run the interface and JS runtimes means that hiccups can and will occur frequently. Either the design where the interface is run on its own thread; and the engine is on its own or the ability to start webworks will eliminate these types of issues where you need to do any long running calculations.

    Please vote for this feature in our ideas portal.

  • 4

    Security for the JS code

    Think of ways to IP protection of the JavaScript which is packaged in the app packages.

    If you are interested in this feature please leave comment here and vote for this issue in our ideas portal.

  • 5

    Error in properties.js from tns-core-modules

    I upgraded my app from {N} v2.something to v3.0 and now I have an error inside the tns-core-modules (which I also updated to 3.0.0).

    Here is what I think is the relevant part:

    TypeError: Cannot read property 'prototype' of undefined
    File: "file:///data/data/org.nativescript.HonkMeNative/files/app/tns_modules/tns-core-
    modules/ui/core/properties/properties.js, line: 461, column: 33
    

    You can find the full stack-trace on PasteBin

    I can realize that I've messed up, as the defaul HelloWorld app works, until I replace it with my code, but I have no clue where to start investigating.

    It looks CSS related from snooping inside the code, but I have no CSS other than an empty module css and the default app.css.

  • 6

    iOS 14 and Nativescript

    Hello,

    Has anyone been able to run their Nativescript on iOS 14? Running
    "tns-ios": { "version": "6.5.1" }

    does not work with iOS 14.

    Running it in XCode 12 showed the error in main.m

    [runtime executeModule:@"./"]; Thread 1: EXC_BAD_ACCESS (code=1, address=0x2818dd0)

    Any ideas on how to resolve this issue?

  • 7

    Allow borders to be applied on a per-side basis in CSS

    I'm finding that I frequently need to put a border on one side of a UI component, but NativeScript currently does not support this. I'm requesting that the following CSS properties be added:

    • border-top-width
    • border-top-color
    • border-right-width
    • border-right-color
    • border-bottom-width
    • border-bottom-color
    • border-left-width
    • border-left-color

    To be consistent with CSS, I would also like the border-width and border-color shorthands to work like they do in CSS.

    screen shot 2015-09-30 at 8 17 47 am

    Update: You can vote for this feature at https://nativescript.ideas.aha.io/ideas/NS-I-110.

    Thanks.

  • 8

    Page Navigation Transitions

    Would be great to be able to customise the transitions between pages. Right now it's either animation or no animation. Both Android and iOS support custom transistions.

  • 9

    [MacOS] build android failed on app:mergeDebugAssets (unable to create new native thread)

    Did you verify this is a real problem by searching the NativeScript Forum and the other open issues in this repo?

    Yes

    Tell us about the problem

    tns build android failed on ':app:mergeDebugAssets' > unable to create new native thread

    Which platform(s) does your issue occur on?

    Android development on macOS Sierra

    Please provide the following version numbers that your issue occurs with:

    • tns info output
       ✔ Component nativescript has 4.0.0 version and is up to date.
       ✔ Component tns-core-modules has 4.0.0 version and is up to date.
       ✔ Component tns-android has 4.0.1 version and is up to date.
      
    • Cross-platform modules: (check the 'version' attribute in the node_modules/tns-core-modules/package.json file in your project)
      {
        "version": "4.0.0"
      }
      
    • Runtime(s): (look for the "tns-android" and "tns-ios" properties in the package.json file of your project)
          "tns-android": {
            "version": "4.0.1"
          }
      
    • Plugin(s): (look for the version number in the package.json file of your project) No plugin

    Please tell us how to recreate the issue in as much detail as possible.

    I just run tns create sample-project --template tns-template-tab-navigation-ng, then run tns build android and the error mentioned above appeared

    *note: run tns debug android --bundle completed without error

    tns doctor output

    ✔ Getting environment information 
    ✔ Your ANDROID_HOME environment variable is set and points to correct directory.
    ✔ Your adb from the Android SDK is correctly installed.
    ✔ The Android SDK is installed.
    ✔ A compatible Android SDK for compilation is found.
    ✔ Javac is installed and is configured properly.
    ✔ The Java Development Kit (JDK) is installed and is configured properly.
    ✔ Xcode is installed and is configured properly.
    ✔ xcodeproj is installed and is configured properly.
    ✔ CocoaPods are installed.
    ✔ CocoaPods update is not required.
    ✔ CocoaPods are configured properly.
    ✔ Your current CocoaPods version is newer than 1.0.0.
    ✔ Python installed and configured correctly.
    ✔ The Python 'six' package is found.
    No issues were detected.
    ✔ Getting NativeScript components versions information...
    ✔ Component nativescript has 4.0.0 version and is up to date.
    ✔ Component tns-core-modules has 4.0.0 version and is up to date.
    ✔ Component tns-android has 4.0.1 version and is up to date.
    ✖ Component tns-ios is not installed.
    

    tns debug android --log trace, output attached trace.log.zip

    Is there code involved? If so, please share the minimal amount of code needed to recreate the problem.

    No

  • 10

    Feature Request: Paged Slider UI component

    There is currently no abstraction for a "paged slider" component (not sure if there's a better name for it). It's where you can scroll horizontally between 'pages' of content, with your position indicated by dots below.

    You can see an example of this on the iOS home screen: 2013-06-11-01 10 32

  • 11

    change the outDir of the transpiled code

    I don't like the js files being generated next to my ts/ng files , it's so annoying , so I was trying to put the compiled/transpiled js files outside the app directory, as any Angular app.

    what I did is :

    I added outDir to the compilerOptions inside the tsconfig.json file

    {
        "compilerOptions": {
            "outDir": "./compiled/",
    ....
    

    and changed the main entrypoint inside app/package.json

    {
      "android": {
        "v8Flags": "--expose_gc"
      },
      "main": "./compiled/main.js",
    

    by doing so the app crashes since it can't find the main.js...

    what is the correct way to achieve that?


    Want to back this issue? Post a bounty on it! We accept bounties via Bountysource.

  • 12

    Can launch the project with android emilator

    Issue Description

    I create a new nativescript project and launched tns run android commande but I get this erro image I didn't modify anything in the new project and tns doctor doesn't return any error does anyone has an idea?

    Reproduction

    No response

    Relevant log output (if applicable)

    No response

    Environment

    No response

    Please accept these terms

  • 13

    feat(core): new autoFillTypes

    Add new autoFillTypes:

    • for oneTimeCode on android i chose AUTOFILL_HINT_2FA_APP_OTP but there is also sms and email otp. Not 100% sure which one to choose
    • UITextContentTypeNewPassword was added in iOS 12. Do we need a check for ios version?
  • 14

    Error: Build input file cannot be found, when building NativeScript application with Xcode 14.1 using m1 mac

    Issue Description

    When building nativescript cross-platform application for ios, i get the following error.

    Build input file cannot be found: 'xxx/platforms/ios/Build/Products/Debug-iphonesimulator/metadata-arm64.bin'. Did you forget to declare this file as an output of a script phase or custom build rule which produces it?

    Reproduction

    xcode 14.1 ✔ Component nativescript has 8.4.0 version and is up to date. ✔ Component @nativescript/core has 8.4.1 version and is up to date. ✔ Component @nativescript/ios has 8.4.0 version and is up to date.

    i would be very grateful for help and a way out of this

    Relevant log output (if applicable)

    No response

    Environment

    No response

    Please accept these terms

  • 15

    iOS: When execute more than one animation it is not canceled

    Issue Description

    When you run an animation and then run another on the same element on ios the first animation is not cancelled. In android it works fine, my animations types:

    view.animate({
                    scale: {
                        x: 1,
                        y: 1
                    },
                    duration: durationAnimation
                })
    

    Reproduction

    No response

    Relevant log output (if applicable)

    No response

    Environment

    OS: macOS 13.1
    CPU: (24) x64 AMD Ryzen 9 3900X 12-Core Processor            
    Shell: /bin/zsh
    node: 18.12.1
    npm: 8.19.2
    nativescript: 8.4.0
    
    # android
    java: 11.0.17
    ndk: Not Found
    apis: Not Found
    build_tools: Not Found
    system_images: Not Found
    
    # ios
    xcode: 14.2/14C18
    cocoapods: 1.11.3
    python: 3.11.1
    python3: 3.11.1
    ruby: 2.7.7
    platforms: 
      - DriverKit 22.2
      - iOS 16.2
      - macOS 13.1
      - tvOS 16.1
      - watchOS 9.1
    

    Dependencies

    "dependencies": {
      "@nativescript-community/text": "^1.5.11",
      "@nativescript-community/ui-canvaslabel": "^1.1.8",
      "@nativescript-community/ui-collectionview": "^4.0.64",
      "@nativescript-community/ui-label": "^1.2.16",
      "@nativescript-community/ui-lottie": "^5.0.3",
      "@nativescript-community/ui-material-cardview": "^7.0.31",
      "@nativescript-community/ui-material-tabs": "^7.0.31",
      "@nativescript-community/ui-material-textfield": "^7.0.33",
      "@nativescript-community/ui-svg": "^0.1.2",
      "@nativescript/core": "^8.4.1",
      "@nativescript/firebase-core": "^2.4.4",
      "@nativescript/firebase-messaging": "^2.4.4",
      "@nativescript/geolocation": "^8.1.0",
      "@nativescript/google-maps": "^1.4.9",
      "@nstudio/nativescript-shimmer": "^1.0.7",
      "axios": "^0.19.2",
      "moment": "^2.29.4",
      "nativescript-vue": "^3.0.0-beta.5",
      "patch-package": "^6.5.0",
      "pinia": "^2.0.27",
      "router-vue-native": "^2.0.0"
    },
    "devDependencies": {
      "@nativescript/android": "^8.4.0",
      "@nativescript/ios": "8.4.0",
      "@nativescript/tailwind": "^2.0.1",
      "@nativescript/types": "~8.4.0",
      "@nativescript/webpack": "~5.0.0",
      "@types/node": "~17.0.21",
      "sass": "^1.56.1",
      "sass-loader": "^13.2.0",
      "tailwindcss": "^3.1.8",
      "typescript": "~4.8.4",
      "vue": "^3.2.45"
    }
    

    Please accept these terms

  • 16

    fix(webpack): notify CLI even if there are compilation errors

    PR Checklist

    • [x] The PR title follows our guidelines: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/CONTRIBUTING.md#commit-messages.
    • [x] There is an issue for the bug/feature this PR is for. To avoid wasting your time, it's best to open a suggestion issue first and wait for approval before working on it.
    • [x] You have signed the CLA.
    • [x] All existing tests are passing: https://github.com/NativeScript/NativeScript/blob/master/tools/notes/DevelopmentWorkflow.md#running-unit-tests-application.
    • [ ] Tests for the changes are included - https://github.com/NativeScript/NativeScript/blob/master/tools/notes/WritingUnitTests.md.

    What is the current behavior?

    When there's a compilation error, webpack may emit files (depending on how it's configured), however the CLI is never notified of these files, so they are not synced to the device. This is generally the right behavior however there are cases where this isn't ideal, most notably with HMR. When there's a compilation error, a new hash is assigned to the compilation, and files are written but never synced. After fixing the error, yet another hash is generated, however the app will not be able to apply hmr because it must first apply the "errored" hash, and then the fixed one - it works like a sequential chain, and if we don't emit the errored chain links, we break HMR.

    What is the new behavior?

    The CLI is notified regardless of errors in the compilation. This may crash the app - however that's expected in some cases. In other cases this should fix HMR breakage after a single error during development.

    References:

    • https://github.com/nativescript-vue/nativescript-vue/issues/1013