[DikeJS]RequireJS引入CSS样式文件(五)_html/css_WEB-ITnose

在实际开发组件时,我们常常需要关注组件的样式,样式如何定义,以及样式如何引用,我关注此问题时也纠结了一小下,不过还好,requirejs周边给我们提供了丰富的插件,我们可以直接使用css.js,具体的使用方法如下:

(function () {    requirejs.config({        paths: {            jquery   : 'lib/jquery-1.11.1.min',            Template : 'Component/util/Template',            Button   : 'Component/view/button/Button',            Canvas   : 'Component/view/canvas/Canvas',            Container: 'Component/view/container/Container'        },        /**         * 设置css.js文件路径         */        map  : {            '*': {                'css' : 'lib/css'            }        },        /**         * 样式按照需要加载加载 键值名和加载模块的名称一致,目的是加载模块时加载对应的css样式         */        shim : {            'Canvas1': ['css!./Component/view/canvas/css/login.css'],            'Button' : ['css!./Component/view/button/css/ty-main.css']        }    });    define(function (require) {        var $ = require('jquery');        $(document).ready(function () {            var container = new (require('Container'))({                id    : 'container',                name  : 'container',                width : '300px',                height: '500px',                render: $('body')            });            var canvas = new (require('Canvas'))({                id       : 'Canvas',                name     : 'Canvas',                //render   : $('body'),                listeners: {                    onReady: function (_this) {                        var ctx = _this.getContext2D();                        ctx.fillStyle = '#FF0000';                        ctx.fillRect(0, 0, 80, 100);                    },                    click  : function () {                        alert(1);                    }                }            });             container.add(canvas);        });    });})();

登录后复制

请仔细查看注释,你就明白如何引入css样式了,而且是在初次加载页面的时候就会将css样式写入到

以上就是[DikeJS]RequireJS引入CSS样式文件(五)_html/css_WEB-ITnose的内容,更多相关内容请关注PHP中文网(www.php.cn)!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3114265.html

(0)
上一篇 2025年3月29日 12:19:37
下一篇 2025年3月29日 12:19:45

AD推荐 黄金广告位招租... 更多推荐

发表回复

登录后才能评论