How to Install AngularJS on Ubuntu 22.04 LTS for Quick Projects
If you’re looking to get a classic AngularJS setup up and running on your fresh Ubuntu 22.04 LTS machine, this is the place to be. You’ll learn how to pull Node.js, bootstrap an AngularJS project with npm, and run it locally in no time.
Prerequisites for Installing AngularJS on Ubuntu 22.04 LTS
Before you even think about dropping any “angularjs” commands, make sure your system can speak the language of modern JavaScript tooling:
1. Update your package list – It’s cheap and prevents surprises later.
sudo apt update
2. Install Node.js 18.x (or newer) – AngularJS works fine with Node 12+, but 18 is the LTS that ships cleanly on Ubuntu 22.04.
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash - sudo apt install -y nodejs
3. Check versions – A quick sanity check keeps you from chasing phantom bugs.
node --version npm --version
If you see a Node version older than 12, you’ll be in trouble later on.
Why this matters: Many of us have seen the dreaded “npm ERR! code EACCES” pop up when Node wasn’t installed properly. Skipping this step usually leads to headaches that are easy to avoid.
Installing AngularJS via npm
AngularJS is a browser‑side framework, but you can still manage its files with npm and serve them locally:
1. Create a project folder – Keep things tidy.
mkdir my-angularjs-app && cd my-angularjs-app
2. Initialize an npm package – Even if you’re not writing Node code, this gives you `package.json` for dependency tracking.
npm init -y
3. Install the AngularJS library – The official package lives under the name `angular`.
npm install angular --save
4. Verify the installation – Quick check that the files are in place.
ls node_modules/angular
You should see `angular.js` and a few other supporting files.
Why this matters: Installing through npm guarantees you get the latest 1.x release (currently 1.8.2) and lets future updates land with a single command. It also sidesteps the pitfalls of manually downloading from an old CDN that might be offline.
Bootstrapping a Minimal AngularJS App
Now that the library is in your folder, let’s spin up a simple demo:
1. Create an `index.html` – Point it to the local copy of AngularJS and add a tiny controller.
<!DOCTYPE html>
<html ng-app="demoApp">
<head>
<meta charset="utf-8">
<title>AngularJS Demo</title>
<script src="https://www.linuxcompatible.org/./node_modules/angular/angular.js"></script>
<script>
angular.module('demoApp', [])
.controller('DemoCtrl', function($scope) {
$scope.message = 'Hello from AngularJS on Ubuntu!';
});
</script>
</head>
<body ng-controller="DemoCtrl">
<h1>{{ message }}</h1>
</body>
</html>
2. Serve the file – You can use a tiny static server; `npx http-server` is quick and requires no installation.
npx http-server .
Open `http://localhost:8080` in your browser to see the greeting.
Why this matters: Using a local server respects AngularJS’s expectation of being served over HTTP, which avoids “file‑protocol” errors that crop up when you double‑click the HTML file.
Troubleshooting Common Pitfalls
- Node or npm not found – If your shell can’t locate `node` or `npm`, re‑run the Node.js setup script and double‑check `/usr/bin/node`.
- AngularJS version mismatch – The package name is simply `angular`. Installing `@angular/core` will pull in Angular (v12+), not the 1.x you’re after. I’ve seen people accidentally install the wrong one because the names look similar.
- Permission errors during npm install – If you get an EACCES error, try installing with `sudo`, but the better fix is to set up a proper Node version manager like nvm, so you don’t need root privileges for your own projects.
That’s it. You now have AngularJS running on Ubuntu 22.04 LTS, ready to build small prototypes or keep legacy code alive.
