[Angular] (Learning 1) Build the environment

The composition of the MVVM framework:

Data binding, repertoire, component-based programming, routing and navigation, state preservation, third-party component libraries

AngualrJS v1.x official website: https://angularjs.org
Angular v2.x and above official website: https://angular.io Chinese mirror official website: https://angular.cn

AngularJs development method: ①script introduction ②scaffolding method
Angular development method: ①scaffolding method

Build the Angular environment:

Prerequisites: ① Install the corresponding version of node and npm   ② Understand typeScript

npm install -g typescript  # 安装最新的TypeScript稳定版

1. Download and install the scaffolding tool (one computer only needs to be installed once)

Default repository: registry.npmjs.com

Tips: Use a third-party npm download repository

    View the current npm default download warehouse address:

        npm config get registry

    Modify the default download warehouse address of npm to the domestic mirror website:

        npm config set registry new warehouse address

    For example, you can use the npm image provided by Taobao:

        npm config set registry https://registry.npm.taobao.org

npm install -g @angular/cli

By default, it is installed in the installation package of C:\Users\{User}\AppData\Roaming\npm

All global tools are installed to the above paths and cannot be modified.

Common problems when downloading scaffolding:

①ENOENT:no such file or directory,access to C:/User/...Roaming/npm

   Solution: Log back in with an administrator account

②npm ERR:Cannot read property resolve of undefined

   Solution: try again later, or change the warehouse address

③git command not found

   Reason: For versions above v8.x, angular creates a .git file by default, and uses git to manage projects

  Solution: Just install git on the computer, and it will not affect the use of angular if it is not installed

 2. Run the scaffolding tool to create a blank project

ng new my-app

Select the file directory to save the project, and create 

3. Enter the blank project and run the development server

cd my-app
npm start

ng serve The command starts the development server, watches the files, and rebuilds the app when those files change.

--open(or just  -o the abbreviation) option will automatically open your browser with access  http://localhost:4200/.

--port 3000 选项会修改默认端口号,access http://localhost:3000/

 4. Client access test

http://localhost:4200

http://127.0.0.1:4200


Angular modifies the default port number:

Modify the command in the package.json file: ng serve --port 3000

Guess you like

Origin blog.csdn.net/xiaoxiong_jiaxin/article/details/119410126