资讯专栏INFORMATION COLUMN

angluar4使用非npm安装的js插件和cnpm下使用bootstrap遇到的问题

lylwyy2016 / 1681人阅读

摘要:在引入将下载下来原谅没看可以使用安装,将那些,放入这个目录里面。你要用声明这个关键字这样就可以在中使用了年月日指定元素使用出现没有作用的之前用创建工程直接安装和,然后安装他的类型描述文件。

  由于项目需要一个选择年月日,选择时分秒和选择时见间隔的插件,本来打算用ng-zorro,结果发现ng-zorro有点不符合要求,而且有点大,所以就用了layDate.js。

在angular4引入layDate.js

1:将layDate.js下载下来(layDate.js原谅没看可以使用npm安装),将那些js,css放入assets这个目录里面。

2:在angular-cli里面引入layDate.js

"scripts": [
    "../src/assets/laydate.js"
],

3:这是感觉已经可以了,不,laydate这个关键字angular是不认识的。你要用declare 声明这个关键字

declare let laydate;

4:这样就可以在angular4中使用laydate.js了

let self = this;
// 年月日
laydate.render({
  elem: "#time", //指定元素
  theme: "#ff7e00",
  done: function(value, date, endDate){
    self.year = value;
  }
});
cnpm使用boosttrap出现没有作用的

  之前用npm创建angular4工程直接npm install安装bootstrap和jquery,然后安装他的@types类型描述文件。在angular-cli中引入就可以了。

"styles": [
    "../node_modules/bootstrap/dist/css/bootstrap.css"

],
    "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/bootstrap/dist/js/bootstrap.js",
]

但是cnpm完全没有效果,带着疑问到处查找,最后发现cnpm生成下拉bootstrap包的路径是这样_bootstrap@3.3.7@bootstrap,然后改下路径就可以了,如下:

"styles": [
   
    "../node_modules/_bootstrap@3.3.7@bootstrap/dist/css/bootstrap.css"
],
    "scripts": [
    "../node_modules/_jquery@3.2.1@jquery/dist/jquery.js",
    "../node_modules/_bootstrap@3.3.7@bootstrap/dist/js/bootstrap.js"
],

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/51585.html

相关文章

  • angluar4使用npm安装js插件cnpm使用bootstrap遇到问题

    摘要:在引入将下载下来原谅没看可以使用安装,将那些,放入这个目录里面。你要用声明这个关键字这样就可以在中使用了年月日指定元素使用出现没有作用的之前用创建工程直接安装和,然后安装他的类型描述文件。   由于项目需要一个选择年月日,选择时分秒和选择时见间隔的插件,本来打算用ng-zorro,结果发现ng-zorro有点不符合要求,而且有点大,所以就用了layDate.js。 在angular4引...

    zhichangterry 评论0 收藏0
  • angluar4使用npm安装js插件cnpm使用bootstrap遇到问题

    摘要:在引入将下载下来原谅没看可以使用安装,将那些,放入这个目录里面。你要用声明这个关键字这样就可以在中使用了年月日指定元素使用出现没有作用的之前用创建工程直接安装和,然后安装他的类型描述文件。   由于项目需要一个选择年月日,选择时分秒和选择时见间隔的插件,本来打算用ng-zorro,结果发现ng-zorro有点不符合要求,而且有点大,所以就用了layDate.js。 在angular4引...

    cjie 评论0 收藏0
  • Angular开山篇

    摘要:环境搭建今天给大家介绍种环境搭建的方法。官方的地址步骤安装种子文件没有的,可以自己下来,然后打开,执行。使用版本为版本。存放表单相关内置组件与指令。存放网络请求相关的服务等。等待加载完毕即可。从而实现了页面的显示 1:环境搭建 今天给大家介绍4种环境搭建的方法。 一:Angular-cli的安装 官方指导文档:www.angular.cn/guide/quickstart 请使用cn...

    Edison 评论0 收藏0
  • Vue 2.x 实战之后台管理系统开发(一)

    摘要:导语下文实战之后台管理系统开发二该文章将从头到尾梳理我是如何使用开发一个后台管理项目的,我会将自己遇到的问题贴出,希望可以帮助到其他人。构建项目框架准备对于大陆用户,建议将的注册表源设置为国内的镜像,如淘宝镜像,可以大幅提升安装速度。 1. 导语 下文:Vue 2.x 实战之后台管理系统开发(二) 该文章将从头到尾梳理我是如何使用 Vue 2 开发一个后台管理项目的,我会将自己遇到的问...

    darkbaby123 评论0 收藏0
  • gulpwebpack入门介绍

    摘要:介绍说明的包管理器,用于插件管理包括安装卸载管理依赖等使用安装插件命令提示符执行插件名称。总结安装新建文件全局和本地安装安装插件新建文件通过命令提示符运行任务。 showImg(https://segmentfault.com/img/remote/1460000010873466); 前言 众所周知目前比较火的工具就是gulp和webpack,但webpack和gulp却有所不同,本...

    hsluoyz 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<