Как перенести существующее приложение NativeScript в веб-приложение - Разделение кода - PullRequest
Новая
       14

Как перенести существующее приложение NativeScript в веб-приложение - Разделение кода

0 голосов
/ 12 апреля 2019

В официальной документации есть только примеры того, как перенести веб-приложение в NativeScript, но я хочу перенести существующий NativeScript в веб-приложение.

Я не могу найти решение нигде в Интернете. Возможно ли вообще сделать это наоборот или только из WEB в NativeScript?

Я пытался сделать тот же процесс внутри моего проекта NativeScript, но я не могу использовать ни одну из команд @angular/cli.

1 Ответ

0 голосов
/ 15 апреля 2019

Я сделал то же самое для одного из моих предыдущих проектов только для мобильных устройств {NS}.Изначально это была не простая поездка, но как только вы решите, очень экономно время, чтобы использовать одну и ту же кодовую базу как для Интернета, так и для мобильных устройств.Вот шаги, которые я бы предложил, основываясь на моем опыте.

  1. Вы должны использовать @ angular / cli @ 6.1.0 или новее.npm i -g @angular/cli
  2. Установить нативные скриптовые схемы.npm i -g @nativescript/schematics
  3. Создать новый проект.ng new --collection=@nativescript/schematics my-mobile-app (Я сделал это таким образом, а затем скопировал из папки Mobile app папку src / app).
  4. Скопируйте папку app / src из существующего проекта.(Возможно, вы захотите найти исходную папку в nsconfig.json "appPath": "app")
  5. Найдите файл .ts, в котором вы используете специфические компоненты для мобильных устройств, и создайте для него класс-оболочку .Например, я использовал Fancy Alerts для мобильных приложений, поэтому я создал вспомогательный класс оболочки, такой как helper.tns.ts и helper.ts

в helper.ts 

public show() {
    alert('Javascript+HTML alert')  .
  }

в helper.tns.ts 

public show() {
    TNSFancyAlert.showWarning('Warning!', 'Message', `Ok`, 0, 300).then(() => {
         resolve('Success');
    });  
  }
Переименуйте все .html в .tns.html и создайте веб-html-файлы.

Создание веб-приложения 

ng serve

Создание мобильного приложения 

tns run android --bundle
tns run ios --bundle

PS --bundle - это ключ для компиляции только определенных файлов для мобильных устройств.HTML-код, который определяет представление компонента, должен отличаться для веб-приложения и мобильного приложения.

...