用intellij+angular写一个index.html
- Greate a static web project by intellij

- use ** cd IdeaProjects/test ** go to the project directory which u created

- use ** npm init ** to initialize the project. It will creat a ** package.json ** file to record the dependencies of this project. Just press the ** return ** to create a default package.json file.

now check ur project in Intellij, the package.json is already there.

-
If u use the git as a VCS, u can use ** vim .gitignore ** to add the ignore file which used to tag the files and directories which u don't want to sync or commit. (usually some config files or libraries)
5.png
now back to Intellij, if u not plugin the .ignore in ur Intellij u'd better install it (the Intellij will remind u to install .ignore just follow the hint). U can also press ** command + , ** to open the preference then ** -> plugins -> Browse repositories... -> search ".ignore" -> install ** to install the plugin.

-
then use ** npm install angular ** to add the angular into project
7.png
now back to intellij the ** angular.js ** is contented in the ** node_modules **

- then add a html file to the project and name it as ** index **
copy following code into the index.html
<html ng-app>
<head>
<script src="node_modules/angular/angular.min.js"></script></head>
<body>
<div>
<label>NameNameName:</label>
<input type="text" ng-model="yourName" placeholder="Enter a name here">
<hr>
<h1>Hello {{yourName}}!</h1>
</div>
</body>
</html>
-
then use ** http-server ** to start the http server
9.png
then open ur Browser and type ** localhost:8080 ** in the url to check ur first angular html.

网友评论