When the Google Angular team releases a new version I like to move onto it.\u00a0 I do this by upgrading Angular, starting a new project, and then bringing in the source code from my existing project.<\/p>\n
I’ve been doing my Angular development on an Amazon Web Services Ubuntu Linux server.\u00a0 The examples I show here are Linux operating system commands that overwrite files.\u00a0 Please be careful and do not expect that I will be accountable if you try this and anything goes wrong.\u00a0 Consider making a backup of your system before you begin.<\/p>\n
[10-May-2018:\u00a0 I don’t have this working yet for Angular 6.\u00a0 I think the problem is that flex-layout is not yet published for Angular 6.\u00a0 Waiting for that.]<\/strong><\/p>\n As a reference, I issue the ng version<\/em> command in my existing project and keep a copy of the results in an open text editing window.\u00a0 Here my old existing project is randomizer<\/em>:<\/p>\n Then I proceed with my upgrade process.<\/p>\n To upgrade Angular I actually just install it again.\u00a0 Here my new project name is shufflizer:<\/em><\/p>\n I do a build of the new project at this point to confirm.\u00a0 It’s the stock starter project.\u00a0 There should be no error messages:<\/p>\n Also at this point I can issue the ng version<\/em> command in the new project and confirm that I am running a new version of Angular.\u00a0 I look to see that the version numbers are mostly higher than the ng version<\/em> results from my old project.\u00a0 If they are then I figure I must be on the right track:<\/p>\n Example results:<\/p>\n Again, my old project is randomizer<\/em>.\u00a0 The new project is shufflizer.<\/em><\/p>\n The cp ~-<\/em> command syntax is the Unix\/Linux way to copy a file from the previous directory into the current directory.\u00a0 The cp -r<\/em> gets subdirectories and their contents too:<\/p>\n Now I can build the new project. It’s a new version of the project that I have been working on.\u00a0 It builds totally clean, with the latest version of Angular.<\/p>\n","protected":false},"excerpt":{"rendered":" When the Google Angular team releases a new version I like to move onto it.\u00a0 I do this by upgrading Angular, starting a new project, and then bringing in the source code from my existing project. I’ve been doing my Angular development on an Amazon Web Services Ubuntu Linux server.\u00a0 The examples I show here … <\/p>\nRecord the old version numbers<\/h6>\n
cd ~\/randomizer\/\r\nng version<\/pre>\n
Upgrade Angular and create new project<\/h6>\n
npm install -g @angular\/cli\r\nnpm install --save @angular\/material @angular\/cdk\r\nnpm install @angular\/flex-layout --save\r\n\r\nng new shufflizer<\/pre>\n
cd ~\/shufflizer\/\r\nng build --target=production --base-href '\/trashthis\/'<\/pre>\n
cd ~\/shufflizer\/\r\nng version<\/pre>\n
Angular CLI: 1.7.4\r\nNode: 9.0.0\r\nOS: linux x64\r\nAngular: 5.2.10\r\n... animations, common, compiler, compiler-cli, core, forms\r\n... http, language-service, platform-browser\r\n... platform-browser-dynamic, router\r\n\r\n@angular\/cdk: 5.2.5\r\n@angular\/cli: 1.7.4\r\n@angular\/flex-layout: 5.0.0-beta.14\r\n@angular\/material: 5.2.5\r\n@angular-devkit\/build-optimizer: 0.3.2\r\n@angular-devkit\/core: 0.3.2\r\n@angular-devkit\/schematics: 0.3.2\r\n@ngtools\/json-schema: 1.2.0\r\n@ngtools\/webpack: 1.10.2\r\n@schematics\/angular: 0.3.2\r\n@schematics\/package-update: 0.3.2\r\ntypescript: 2.5.3\r\nwebpack: 3.11.0<\/pre>\n
Bring in the source code from my existing project<\/h6>\n
cd ~\/randomizer\/src\/\r\ncd ~\/shufflizer\/src\/\r\ncp ~-\/index.html .\r\ncp ~-\/styles.css .\r\ncd ~\/shufflizer\/src\/app\/\r\ncp -r ~\/randomizer\/src\/app\/* .<\/pre>\n