Deepin 20 UOS 20 安装AngularJS 开发环境方案

推荐大家使用 VS code 工具编写代码,工具在官网有.deb的安装包,大家可以去下载安装。然后使用VS code编写前段代码。

1.查看官网指引:https://angular.io/guide/setup-local

To use the Angular framework, you should be familiar with the following:

  • JavaScript
  • HTML
  • CSS

2.安装Node.js

Angular requires a current, active LTS, or maintenance LTS version of Node.js. See the engines key for the specific version requirements in our package.json.

  • To check your version, run node -v in a terminal/console window.

  • To get Node.js, go to nodejs.org

sudo apt-get install nodejs npm

node -v

npm -v

3.安装AngularJS CLI脚手架

npm install -g @angular/cli

4.创建工作空间并初始化项目

ng new my-app

5.启动项目

cd my-app
ng serve --open

6.项目目录结构介绍

Workspace configuration files

All projects within a workspace share a CLI configuration context. The top level of the workspace contains workspace-wide configuration files, configuration files for the root-level application, and subfolders for the root-level application source and test files.

WORKSPACE CONFIG FILES PURPOSE
.editorconfig

Configuration for code editors. See EditorConfig.

代码编辑器的配置。

.gitignore

Specifies intentionally untracked files that Git should ignore.

明确Git忽略提交的文件类型。

README.md

Introductory documentation for the root app.

应用介绍文档

angular.json

CLI configuration defaults for all projects in the workspace, including configuration options for build, serve, and test tools that the CLI uses, such as TSLint, Karma, and Protractor. For details, see Angular Workspace Configuration.

工作区间内CLI的全局配置

package.json

Configures npm package dependencies that are available to all projects in the workspace. See npm documentation for the specific format and contents of this file.

npm包依赖管理

package-lock.json

Provides version information for all packages installed into node_modules by the npm client. See npm documentation for details. If you use the yarn client, this file will be yarn.lock instead.

npm包依赖版本号管理

src/

Source files for the root-level application project.

源文件目录

node_modules/

Provides npm packages to the entire workspace. Workspace-wide node_modules dependencies are visible to all projects.

npm依赖包存储位置

tsconfig.json

Default TypeScript configuration for projects in the workspace.

默认TS全局配置

tslint.json

Default TSLint configuration for projects in the workspace.

默认TSLint全局配置

Application source files

Files at the top level of src/ support testing and running your application. Subfolders contain the application source and application-specific configuration.

APP SUPPORT FILES PURPOSE
app/

Contains the component files in which your application logic and data are defined. See details below.

包含逻辑定义和数据申明的组建文件

assets/

Contains image and other asset files to be copied as-is when you build your application.

包含应用需要的图片和其他资源文件

environments/

Contains build configuration options for particular target environments. By default there is an unnamed standard development environment and a production ("prod") environment. You can define additional target environment configurations.

开发和生产环境分离和切换配置

favicon.ico

An icon to use for this application in the bookmark bar.

网页图标

index.html

The main HTML page that is served when someone visits your site. The CLI automatically adds all JavaScript and CSS files when building your app, so you typically don't need to add any 

你可能感兴趣的:(Deepin,Linux,平台开发者)