akveo / ngx-admin

Customizable admin dashboard template based on Angular 10+
https://akveo.github.io/ngx-admin/
MIT License
25.28k stars 7.96k forks source link

Upgrade to angular 11 #5815

Closed alejandroaap closed 3 years ago

alejandroaap commented 3 years ago

Issue type

I'm submitting a ... (check one with "x")

Issue description

Current behavior: At the beginning of November the version of angular 11 was presented and I wanted to know when they plan to migrate this library to be compatible with that version.

Expected behavior: Does not apply

Steps to reproduce: Does not apply

Related code:

Does not apply

Other information:

Does not apply

enixlabs commented 3 years ago

We could really do with knowing, as we have the bundle and have began development for A11, but currently Nebular isn't compatible with 11 and we've slowed down to almost a halt on development.

SuzGori commented 3 years ago

@enixlabs That's very sad news to me. ngx-admin is an excellent OSS and one that I hope will continue to evolve with Angular.

SuzGori commented 3 years ago

@alejandroaap @enixlabs

Hey! It worked below. Please also refer to Issue etc. https://github.com/akveo/nebular/issues/2593

{
  "name": "ngx-admin",
  "version": "6.0.0",
  "license": "MIT",
  "repository": {
    "type": "git",
    "url": "git+https://github.com/akveo/ngx-admin.git"
  },
  "bugs": {
    "url": "https://github.com/akveo/ngx-admin/issues"
  },
  "scripts": {
    "ng": "ng",
    "conventional-changelog": "conventional-changelog",
    "start": "ng serve",
    "build": "ng build",
    "build:prod": "npm run build -- --prod --aot",
    "test": "ng test",
    "test:coverage": "rimraf coverage && npm run test -- --code-coverage",
    "lint": "ng lint",
    "lint:fix": "ng lint ngx-admin-demo --fix",
    "lint:styles": "stylelint ./src/**/*.scss",
    "lint:ci": "npm run lint && npm run lint:styles",
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "ng e2e",
    "docs": "compodoc -p src/tsconfig.app.json -d docs",
    "docs:serve": "compodoc -p src/tsconfig.app.json -d docs -s",
    "prepush": "npm run lint:ci",
    "release:changelog": "npm run conventional-changelog -- -p angular -i CHANGELOG.md -s",
    "postinstall": "ngcc --properties es2015 es5 browser module main --first-only --create-ivy-entry-points --tsconfig \"./src/tsconfig.app.json\""
  },
  "dependencies": {
    "@angular/animations": "^11.0.5",
    "@angular/cdk": "^11.0.0",
    "@angular/common": "^11.0.5",
    "@angular/compiler": "^11.0.5",
    "@angular/core": "^11.0.5",
    "@angular/forms": "^11.0.5",
    "@angular/google-maps": "^10.1.3",
    "@angular/platform-browser": "^11.0.5",
    "@angular/platform-browser-dynamic": "^11.0.5",
    "@angular/router": "^11.0.5",
    "@asymmetrik/ngx-leaflet": "3.0.1",
    "@nebular/auth": "^7.0.0-beta.2",
    "@nebular/eva-icons": "^7.0.0-beta.2",
    "@nebular/security": "^7.0.0-beta.2",
    "@nebular/theme": "^7.0.0-beta.2",
    "@swimlane/ngx-charts": "^14.0.0",
    "angular2-chartjs": "^0.4.1",
    "bootstrap": "^4.3.1",
    "chart.js": "^2.7.1",
    "ckeditor": "^4.7.3",
    "classlist.js": "^1.1.20150312",
    "core-js": "^2.5.1",
    "echarts": "^4.0.2",
    "eva-icons": "^1.1.3",
    "intl": "^1.2.5",
    "ionicons": "^2.0.1",
    "leaflet": "^1.2.0",
    "nebular-icons": "^1.1.0",
    "ng2-ckeditor": "^1.2.9",
    "ng2-completer": "^9.0.1",
    "ng2-smart-table": "^1.7.2",
    "ngx-echarts": "^4.2.2",
    "node-sass": "^4.12.0",
    "normalize.css": "^6.0.0",
    "pace-js": "^1.0.2",
    "roboto-fontface": "^0.8.0",
    "rxjs": "^6.6.2",
    "rxjs-compat": "^6.3.0",
    "socicon": "^3.0.5",
    "style-loader": "^1.1.3",
    "tinymce": "^4.5.7",
    "tslib": "^2.0.0",
    "typeface-exo": "^0.0.22",
    "web-animations-js": "^2.3.2",
    "zone.js": "~0.10.3"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1100.5",
    "@angular-devkit/core": "^11.0.5",
    "@angular/cli": "^11.0.5",
    "@angular/compiler-cli": "^11.0.5",
    "@angular/language-service": "^11.0.5",
    "@compodoc/compodoc": "^1.0.1",
    "@fortawesome/fontawesome-free": "^5.2.0",
    "@schematics/angular": "^11.0.5",
    "@types/d3-color": "^1.0.5",
    "@types/googlemaps": "^3.39.3",
    "@types/jasmine": "~3.6.2",
    "@types/jasminewd2": "^2.0.8",
    "@types/leaflet": "^1.2.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "conventional-changelog-cli": "^1.3.4",
    "husky": "^0.13.3",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~6.0.0",
    "karma": "~5.1.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-cli": "^1.0.1",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "npm-run-all": "^4.0.2",
    "protractor": "~7.0.0",
    "rimraf": "^2.6.1",
    "stylelint": "^7.13.0",
    "ts-node": "^3.2.2",
    "tslint": "~6.1.0",
    "tslint-language-service": "^0.9.9",
    "typescript": "4.0.5"
  }
}

Maps does't work.

There are also notes. [value] doesn't work. I didn't use it, so I erased it.

Error: src/app/pages/forms/form-inputs/form-inputs.component.html:57:24 - error NG8002: Can't bind to 'value' since it isn't a known property of 'nb-checkbox'.
1. If 'nb-checkbox' is an Angular component and it has 'value' input, then verify that it is part of this module.
2. If 'nb-checkbox' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

57           <nb-checkbox [value]="true">Checkbox 2</nb-checkbox>

and styles.scss auth does't work.

@import url('https://fonts.googleapis.com/css?family=Open+Sans:400,600,700&display=swap');

// themes - our custom or/and out of the box themes
@import 'themes';

// framework component themes (styles tied to theme variables)
@import '~@nebular/theme/styles/globals';
// @import '~@nebular/auth/styles/all';

@import '~bootstrap/scss/functions';
@import '~bootstrap/scss/variables';
@import '~bootstrap/scss/mixins';
@import '~bootstrap/scss/grid';

// loading progress bar theme
@import './pace.theme';

@import './layout';
@import './overrides';

// install the framework and custom global styles
@include nb-install() {

  // framework global styles
  @include nb-theme-global();
  // @include nb-auth-global();

  @include ngx-layout();
  // loading progress bar
  @include ngx-pace-theme();

  @include nb-overrides();
};
shadabk92 commented 3 years ago

when will this be released ?

alchiweb commented 3 years ago

@alejandroaap @enixlabs styles.scss auth does't work.

// framework component themes (styles tied to theme variables)
@import '~@nebular/theme/styles/globals';
// @import '~@nebular/auth/styles/all';

No need to comment this line, just change 'all' with 'globals':

@import '~@nebular/auth/styles/globals';
alchiweb commented 3 years ago

@alejandroaap @enixlabs

Error: src/app/pages/forms/form-inputs/form-inputs.component.html:57:24 - error NG8002: Can't bind to 'value' since it isn't a known property of 'nb-checkbox'.
1. If 'nb-checkbox' is an Angular component and it has 'value' input, then verify that it is part of this module.
2. If 'nb-checkbox' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

57           <nb-checkbox [value]="true">Checkbox 2</nb-checkbox>

Changing [value] to [checked] make it works.

SuzGori commented 3 years ago

@alchiweb Thanks!

SuzGori commented 3 years ago

Other breaking change is below.

https://github.com/akveo/nebular/blob/245317a38c11726ffdf86e6e74d6fd9f5fcc09a3/CHANGELOG.md#breaking-changes

alchiweb commented 3 years ago

@SuzGori Thanks! I haven't see this. I don't know if other changes are needed... It compiles but.. is it enough?

SuzGori commented 3 years ago

@alchiweb

build is completed. but don't working a few features.

nebular v7.0.0 released!

- "@nebular/auth": "^7.0.0-beta.2",
- "@nebular/eva-icons": "^7.0.0-beta.2",
- "@nebular/security": "^7.0.0-beta.2",
- "@nebular/theme": "^7.0.0-beta.2",
+ "@nebular/auth": "^7.0.0",
+ "@nebular/eva-icons": "^7.0.0",
+ "@nebular/security": "^7.0.0",
+ "@nebular/theme": "^7.0.0",

https://github.com/akveo/nebular/blob/v7.0.0/CHANGELOG.md

SuzGori commented 3 years ago

ngx-admin v7.0.0 released!

https://github.com/akveo/ngx-admin/commit/c2141efb67665480316beba7946a54f790ee7bfd

awesome!