angular里引入flexible.js(rem的布局)

今天想实现页面的自适应,本来用的是栅格,但效果不理想,就想起了rem布局。
以前使用rem布局,都是在原生html里,还没在框架里使用过,百度没百度出来,就自己琢磨,不知道方法规范不规范,反正成功了,操作如下:
1、下载flexible.js
2、引入到angular项目里
angular里引入flexible.js(rem的布局)_第1张图片

3、根据自己的需要修改细节
3.1、在flexible.js里修改每份的像素,
angular里引入flexible.js(rem的布局)_第2张图片
3.2、引入cssrem插件,在设置里设置px值
angular里引入flexible.js(rem的布局)_第3张图片
angular里引入flexible.js(rem的布局)_第4张图片
4、引入flexible到组件里

import 'flexible.js';

5、使用
angular里引入flexible.js(rem的布局)_第5张图片

6、成功的标志
在这里插入图片描述

很久之后来补坑

不仅是flexible.js,还可以引入其他js,步骤:
1、在 tsconfig.json 中设置允许使用外部 js,如下图
angular里引入flexible.js(rem的布局)_第6张图片
2、把下载 jQuery 文件拷贝到项目的目录:assets/lib 下(这里的 lib 是自己创建的目录)
angular里引入flexible.js(rem的布局)_第7张图片
3、保证 angular.json 中有对assets 的声明(一般都有的)
angular里引入flexible.js(rem的布局)_第8张图片
4、引入到组件里

import * from 'src/assets/lib/jquery-3.4.1.js';

5、可以使用了

你可能感兴趣的:(JavaScript,angular)