grunt-inline-assets

0.1.5 • Public • Published

grunt-inline-assets

将HTML代码中引用的js和css文件读取为内联,外部文件可以是本地也可以来自网络

Getting Started

依赖 Grunt 版本~0.4.1

安装

npm install grunt-inline-assets --save-dev

安装后,在 Gruntfile.js 中载入任务

grunt.loadNpmTasks('grunt-inline-assets');

任务配置

步骤

grunt.initConfig() 中添加的配置:

'inline-assets':{
    options:{
        encoding:'utf8',
        // KISSY Modules Maps File 地址,会新增到KISSY MINI种子文件的后面
        // 如果没有引用KISSY,将不会新增
        comboMapFile:'../../map.js',
        onlineFileSSIOnly: true, // 只合并线上文件,本地文件不合并,默认为false
        jsmin: true, //内置js文件时是否进行jsmin,默认为false
        cssmin: true //内置css文件是否进行cssmin,默认false
    },
    main:{
        files: [
            {
                expand: true,
                cwd:'build',
                src: ['pages/**/*.html'],
                dest: 'build/'
            }
        ]
    }
}

比如源文件:

<!DOCTYPE HTML>
<html>
<head>
    <link rel="stylesheet" href="./index.less.css"/>
    <link rel="stylesheet" type="text/css" href="http://g.tbcdn.cn/??tpi/pi/1.1.0/base/index-min.css" />
    <script src="http://g.tbcdn.cn/kissy/m/0.2.1/mini-full-min.js"></script> 
    <script src="../../config.js"></script> 
</head>
<body>...</body>
</html>

构建后的文件

<!DOCTYPE HTML>
<html>
<head>
    <style>CSS文件内容</style>
    <style>CSS文件内容</style>
    <script>KISSY MINI 种子文件内容</script>
    <script>map.js内容</script>
    <script>config.js内容</script>
</head>
<body>...</body>
</html>

Readme

Keywords

Package Sidebar

Install

npm i grunt-inline-assets

Weekly Downloads

3

Version

0.1.5

License

none

Last publish

Collaborators

  • bachi
  • dickeylth