• Ubuntu 安装 Angular8


    Angular的使用(零):安装和命令(Ubuntu)

    说明:请进入root用户下进行如下操作

    1.安装npm

    1.1.安装npm

    1. apt-get install npm //最新版本
    2. npm -g install npm@6.9.0 //安装指定版本

    1.2.查看npm的版本

    npm -v
    

    *[说明]:如果在更新版本之后,发现npm版本还是未发生变化,建议切换用户进行查看。

    2.安装nodejs

    2.1.安装nodejs最新版本

    apt-get install nodejs   //最新版本
    

    2.2.升级nodejs到指定版本

    1. npm cache clean -f // 清理npm的cache
    2. npm install -g n // 版本管理工具 名称n
    3. sudo n 10.16.0 //更新至指定版本(版本切换)
    4. n latest //更新到最新版
    5. sudo n rm 版本号 // 删除版本

    2.3.查看nodejs的版本

    node -v
    

    3.安装angular

    3.1.安装

    1. npm install -g @angular/cli //最新版本
    2. npm install -g @angular/cli@8.1.1 //安装指定版本

    3.2.查看版本

    ng version或者ng -v
    

    3.3.初始化编译项目

    进入项目目录后,执行下面命令

    npm install
    

    如果出现Error: EACCES: permission denied:'/home/username/.npm',则需要在root下赋予权限:

    1. chmod -R 777 .npm
    2. 或者
    3. sudo chown -R 1001:1001 "/home/username/.npm"

    3.4.卸载angular

    1. npm uninstall -g @angular/cli
    2. npm cache verify --force
    3. ng version

    3.5.其他命令

    3.5.1.创建新项目命令
    ng new test-app   //其中test-app为项目名称
    
    3.5.2.项目运行命令
    ng serve --open
    
    3.5.3.创建组件
    1. ng generate component xxx //带有spec.ts文件
    2. ng generate component xxx --no-spec //不带有spec.ts文件
    3. ng generate component xxx --skip-tests // angular11版本没有-no-spec, 使用--skip-tests不生成测试文件
    4. ng generate component xxx -it 生成内联模版(不会单独生成html文件)
    5. ng g c xxx --skip-tests //也可以这个简化版命令
    3.5.4.创建service
    1. ng generate service my-service //生成一个新服务
    2. ng generate service my-service --no-spec //生成一个不带有spec.ts的新服务
    3.5.5.创建管道
    ng generate pipe my-pipe //生成一个新管道
    
    3.5.6.创建路由
    1. ng generate route my-route // 生成一个新路由(该命令暂时为测试成功)
    2. ng g m app-chlid --routing //生成一个带有路由的模块
    3.5.7.创建模型类
    ng generate class my-class //生成一个简易的模型类
    
    3.5.8.创建指令
    ng generate directive my-directive - 生成一个新指令
    

    3.6.其他命令携带参数

    1. --flat 表示是否不需要创建文件夹
    2. --inline-template (-it) 模板是否应该放在ts文件里
    3. --inline-style (-is) 样式是否应该放在ts文件里.
    4. --spec 是否需要创建spec文件(测试文件)
    5. --view-encapsulation (-ve) View Encapsulation策略 (简单理解为样式文件的作用范围策略).
    6. --change-detection (-cd) 变化检查策略.
    7. --prefix 设定这个component的前缀
    8. --dry-run (-d), 打印出生成的文件列表, 而不直接生成.

    说明:3.5和3.6部分参考他人博客链接:Angular的创建组件及其他命令

    4.其他

    1.代码修改,angular-cli不监听导致页面不自动刷新问题,使用以下命令:

    echo 65536 | sudo tee -a /proc/sys/fs/inotify/max_user_watches
    

    或者

    1. 1.删除node_modules文件夹
    2. 2.npm cache clean.
    3. 3.npm install
  • 相关阅读:
    【李沐深度学习笔记】矩阵计算(5)
    MySQL使用教程(基础篇03)
    正则表达式
    面试官:说一下 MyBatis 缓存机制?
    linux运维基础一(shell两类命令&Hash缓存表&命令行历史)
    C#调用C++动态库接口函数和回调函数方法
    创建vMix虚拟集
    Cookie的使用(基于js-cookie插件)
    假冒 Skype 应用程序网络钓鱼分析
    BUUCTF 不一样的flag 1
  • 原文地址:https://blog.csdn.net/qq_19734597/article/details/133992653