/ nodejs

AngularJs 开发配置笔记

最近在研究这个前端框架,先做一下环境配置的笔记作为备忘。

首先

默认安装好了 nodejs 和 npm

配置prefix和cache

查看npm的配置

npm config ls

配置npm下载的依赖包和缓存

npm config set prefix "C:\Program Files\nodejs\node_global"
npm config set cache "C:\Program Files\nodejs\node_global"

如果文件夹不存在的话先创建文件夹。

一般不推荐装在C盘,一安装系统盘原地爆炸……

安装 Typescript

npm install -g typescript typAings

查看版本号,确认安装成功:

tsc -v

安装Angular-cli

angular-cli它是Angular框架官方的一个构建工具,核心是webpack,以及npm做为依赖包

npm install -g @angular/cli

查看版本号,确认安装成功:

ng -v

运行注意

不加版本号会运行不起来?

$ npm i -g npm@3.10.10

总之很简单,没什么好说的。

补充

material 引入的时候注意

npm install --save @angular/material@7.2.0 @angular/cdk@7.2.0

两个版本保持一致,最新版本8.1.x有问题还是用这个版本……

创建 material.module.ts

import { NgModule } from '@angular/core';
import * as MATERIAL_MODULES from '@angular/material';

export function mapMaterialModules() {
  return Object.keys(MATERIAL_MODULES).filter((k) => {
    let asset = MATERIAL_MODULES[k];
    return typeof asset == 'function'
      && asset.name.startsWith('Mat')
      && asset.name.includes('Module');
  }).map((k) => MATERIAL_MODULES[k]);
}
const modules = mapMaterialModules();

@NgModule({
    imports: modules,
    exports: modules
})
export class MaterialModule { }

app.module.ts中引入

import { MaterialModule } from './material.module';

之后在其它页面上就可以用了,也可以用其他的方式引入……

參考

https://cli.angular.io/