Как правильно обновить angular 2 (npm) до последней версии?

еще один хороший пакет, который я использовал для миграции из бета-версии Angular2 в Angular2 2.0.0 final и npm-check-updates

он показывает последнюю доступную версию всех пакетов, указанных в вашем пакете.формат JSON. В отличие от npm outdated Он также способен редактировать ваш пакет.json, что позволяет вам сделать npm upgrade позже.

установить

sudo npm install -g npm-check-updates

использование

ncuдля дисплей

ncu -u для переписывания вашего пакета.json

обновление до последней угловой 5

угловые пакеты Dep: npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router}@latest --save

другие пакеты, которые установлены угловым cli npm install --save core-js@latest rxjs@latest zone.js@latest

угловые пакеты Dev: npm install --save-dev @angular/{compiler-cli,cli,language-service}@latest

типы пакетов Dev: npm install --save-dev @types/{jasmine,jasminewd2,node}@latest

другие пакеты, которые устанавливаются как dev dev с помощью углового cli: npm install --save-dev codelyzer@latest jasmine-core@latest jasmine-spec-reporter@latest karma@latest karma-chrome-launcher@latest karma-cli@latest karma-coverage-istanbul-reporter@latest karma-jasmine@latest karma-jasmine-html-reporter@latest protractor@latest ts-node@latest tslint@latest

установите последнюю поддерживаемую версию, используемую угловым cli (не делайте @новейший): npm install --save-dev [email protected]

переименовать файл angular-cli.json to .угловой-кли.json и обновить содержимое:

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "project": {
    "name": "project3-example"
  },
  "apps": [
    {
      "root": "src",
      "outDir": "dist",
      "assets": [
        "assets",
        "favicon.ico"
      ],
      "index": "index.html",
      "main": "main.ts",
      "polyfills": "polyfills.ts",
      "test": "test.ts",
      "tsconfig": "tsconfig.app.json",
      "testTsconfig": "tsconfig.spec.json",
      "prefix": "app",
      "styles": [
        "styles.css"
      ],
      "scripts": [],
      "environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }
    }
  ],
  "e2e": {
    "protractor": {
      "config": "./protractor.conf.js"
    }
  },
  "lint": [
    {
      "project": "src/tsconfig.app.json",
      "exclude": "**/node_modules/**"
    },
    {
      "project": "src/tsconfig.spec.json",
      "exclude": "**/node_modules/**"
    },
    {
      "project": "e2e/tsconfig.e2e.json",
      "exclude": "**/node_modules/**"
    }
  ],
  "test": {
    "karma": {
      "config": "./karma.conf.js"
    }
  },
  "defaults": {
    "styleExt": "css",
    "component": {}
  }
}

на Баш только для пользователей

если вы находитесь на Mac/Linux или работает баш на Windows(что не будет работать по умолчанию Windows CMD) вы можете запустить эту oneliner:

npm install @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router,compiler-cli}@4.4.5 --save

yarn add @angular/{animations,common,compiler,core,forms,http,platform-browser,platform-browser-dynamic,router,compiler-cli}@4.4.5

просто укажите версию, которую вы не хотите, например, @4.4.5 или поместите @latest, чтобы получить последнюю

Проверьте package.json просто убедитесь, что вы обновляете все @angular/* пакеты, которые вы приложение полагается на

• чтобы увидеть точно @angular версия в вашем проекте run:
  npm ls @angular/compiler или yarn list @angular/compiler
• чтобы проверить последнюю стабильную @angular версия доступна на npm run:
  npm show @angular/compiler version

обновление:
Начиная с CLI v6 вы можете просто запустить ng update для того, чтобы ваши зависимости автоматически обновлялись до новой версии.

С ng update иногда вы, возможно, захотите, чтобы добавить --force флаг. Если вы это сделаете, убедитесь, что версия typescript у вас есть установленный таким образом поддерживается вашей текущей угловой версией, в противном случае вам может потребоваться понизить версию typescript.

официальная страница npm предлагает структурированный метод для обновления угловой версии как для глобальных, так и для локальных сценариев.

1.Прежде всего, вам нужно удалить текущий угловой из вашего система.

npm uninstall -g angular-cli
npm uninstall --save-dev angular-cli
npm uninstall -g @angular/cli

2.Очистите кэш

npm cache clean

EDIT

как указал @candidj

npm cache clean переименован в npm cache verify начиная с npm 5 и далее

3.Установите угловой

npm install -g @angular/cli@latest

4.Локальная настройка проекта, если у вас есть один

rm -rf node_modules
npm install --save-dev @angular/cli@latest
npm install

пожалуйста, проверьте то же самое по ссылке ниже:

https://www.npmjs.com/package/@angular/cli#updating-angular-cli

это решит проблему.

если вы хотите установить/обновить все пакеты до последней версии, и вы используете Windows, вы можете использовать это в powershell.exe:

foreach($package in @("animations","common","compiler","core","forms","http","platform-browser","platform-browser-dynamic","router")) {
    npm install @angular/$package@latest -E
}

если вы используете cli, вы можете сделать это:

foreach($package in @('animations','common','compiler','core','forms','http','platform-browser','platform-browser-dynamic','router', 'cli','compiler-cli')){
    iex "npm install @angular/$package@latest -E $(If($('cli','compiler-cli').Contains($package)){'-D'})";
}

это сохранит пакеты точно (- E), и пакеты cli в devDependencies (- D)

альтернативный подход с использованием npm-upgrade:

1. npm i -g npm-upgrade

перейдите в папку проекта

1. npm-upgrade check

Он спросит вас, если вы хотите обновить пакет, выберите Да

Это просто

просто начните здесь:

https://update.angular.io

выберите версию, которую вы используете, и это даст вам пошаговое руководство.

Я рекомендую выбрать "Дополнительно", чтобы увидеть все шаги. Сложность-это относительная концепция, и я не знаю, чья глупая идея была этой функцией, но если вы выберете "базовый", он не покажет вам все необходимые шаги, и вы можете пропустить что-то важное, что использует ваше "базовое" приложение.

С версии 6 появилась новая угловая команда CLI ng update который разумно проходит через ваши зависимости и выполняет проверки, чтобы убедиться, что вы обновляете правильные вещи : -)

шаги будут изложены, как его использовать: -)

НПМ удалить-сохранить-Дэв угловые-интерфейс командной строки

npm install --save-dev @angular / cli@latest

обновление ng @angular / cli

обновление ng @angular / core --force

обновление ng @angular / material или npm i @angular / cdk@6 @угловой / материал@6 -- save

npm install typescript@'>=2.7.0

лучший способ сделать это-использовать расширение(pflannery.vscode-versionlens) в vscode.

Это проверяет для всех удовлетворяет и проверяет для самой лучшей пригонки.

У меня было много проблем с обновлением и сохранением моего приложения functioining unitll я позволил verbose lense сделать проверку, а затем запустить

npm i

для установки новых предложенных зависимостей.