使用grunt构建seajs项目
1.安装nodejs
2.安装grunt-cli
npm install -g grunt-cli
3.进入到项目目录,同时准备好package.json和Gruntfile.js文件
//package.json文件内容,其中alias指定了jquery的路径,后面一坨是需要用到的grunt插件 {
"name": "seajs_test",
"version": "1.0.0",
"spm": {
"alias": {
"jquery": "lib/jquery-debug"
}
},
"devDependencies": {
"grunt": "^0.4.5",
"grunt-cmd-transport": "~0.3.0",
"grunt-cmd-concat": "~0.2.5",
"grunt-contrib-uglify": "~0.2.4",
"grunt-contrib-clean": "~0.5.0"
}
}
//gruntfile.js文件内容
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
transport: {
options: {
paths: ['js'], // where is the module, default value is ['sea-modules']
alias:'<%= pkg.spm.alias %>'
},
helloworld: {
options: {
idleading: 'helloworld/'
},
files: [
{
cwd: 'js/helloworld',
src: '**/*.js',
dest: '.build/helloworld'
}
]
},
main: {
options: {
idleading: 'main/'
},
files: [
{
cwd: 'js/main',
src: '**/*.js',
dest: '.build/main'
}
]
},
lib: {
options: {
idleading: 'lib/'
},
files: [
{
cwd: 'js/lib',
src: '**/*.js',
dest: '.build/lib'
}
]
}
},
concat: {
options: {
include: 'relative'
},
build: {
files: {
'dist/helloworld/klass.js': ['.build/helloworld/klass.js', '.build/helloworld/circle.js'],
'dist/main/index.js': ['.build/main/index.js'],
'dist/lib/jquery-debug.js':['.build/lib/jquery-debug.js']
}
}
},
uglify: {
main: {
files: {
'dist/helloworld/klass.js': ['dist/helloworld/klass.js'],
'dist/main/index.js': ['dist/main/index.js'],
'dist/lib/jquery-debug.js':['dist/lib/jquery-debug.js']
}
}
},
clean: {
build: ['.build'] // clean .build directory
}
});
grunt.loadNpmTasks('grunt-cmd-transport');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.registerTask("test","my custom task",function(){
console.log("hello grunt");
});
grunt.registerTask('default', ['transport', 'concat', 'uglify', 'clean','test']);
};
4.执行命令
grunt default
其中default就是Gruntfile最后定义的任务名称。
5. 项目目录结构
使用grunt构建seajs项目的更多相关文章
- Grunt 构建SeaJS
GitHub地址:https://github.com/MrLeo/SeaJS 目录结构 目录结构说明 web存放HTML文件 static存放所有HTML需要用到静态资源文件(css.js.img- ...
- Grunt打包seajs项目
在使用seajs时,常常将若干脚本分为多次require进来,这样开发中比较方便,但是,会增加http请求次数,在生产环境中需要进行打包合并.压缩等操作. 以Grunt构建工具为例,对一个seajs项 ...
- 用spm2构建seajs项目的过程
前言 Javascript模块化规范有CommonJs规范,和主要适用于浏览器环境的AMD规范,以及国内的CMD规范,它是SeaJs遵循的模块化规范.因为以前项目中用SeaJs做过前端的模块管理工具, ...
- 使用grunt构建前端项目
1. grunt构建工具是基于nodejs上的,所以在使用之前一定要先安装好nodejs 2. 安装好nodejs后,node -v查看node版本 npm-v 查看npm版本信息 3. 在需要用到的 ...
- grunt构建一个项目
准备工作:grunt基于node环境运行,所有先安装node.js 1.安装grunt,通过node的npm的包管理工具 >npm install grunt --save-dev 2.npm ...
- ☀【SeaJS】SeaJS Grunt构建
如何使用Grunt构建一个中型项目?https://github.com/twinstony/seajs-grunt-build spmjshttp://docs.spmjs.org/doc/inde ...
- Grunt打包之seajs项目【转】
原文:http://www.cnblogs.com/accordion/p/4508154.html grunt与seajs grunt是前端流行的自定义任务的脚手架工具,我们可以使用grunt来为我 ...
- grunt与seajs结合应用
9.seajs构建的问题 01.png和02.jpg 10.seajs与grunt如何结合开发.两个插件:grunt-cmd-transport grunt-cmd-contact ,去grunt官网 ...
- Yeoman自动构建js项目
Aug 19, 2013 Tags: bowergruntJavascriptjsnodejsyeomanyo Comments: 10 Comments Yeoman自动构建js项目 从零开始nod ...
随机推荐
- Windows 10四大版本区别详解:家庭版, 专业版, 企业版和教育版
Windows 10有四个基本版本:Windows 10 家庭版, Windows 10 专业版, Windows 10 企业版, 和Windows 10 教育版(这是Windows家族的新成员).以 ...
- 使用ExceptionHandlingScope进行高效的SharePoint CSOM编程
异常处理 在我们使用SharePoint API的时候,获取某些对象的时候,可能会出异常,那么CSOM如何处理这种情况呢. 我们在获取某个List的时候,代码如下: using (ClientCont ...
- django with mysql (part-3)
step01: write second view-function vim views.py step02: configure your ( urls.py ) vim urls.py step0 ...
- swap函数的四种写法
swap 函数的四种写法 (1)经典型 --- 嫁衣法 void swap(int *a, int *b) { int temp; temp = *a; *a = *b; *b = temp; } ( ...
- Delphi 如何让程序获取权限结束指定进程?
比如说让程序结束进程中360sd.exe 获取权限,否则会拒绝访问, 要怎么写? 补充: 这段代码中……点击按钮后结束不了360进程! unit Unit1;interfaceusesWindow ...
- Clojure上手
Clojure,这是什么鬼?一门基于JVM(现在也有基于.NET CLR的了:Clojure CLR) 的函数式编程语言.在JVM平台运行的时候,会被编译为JVM的字节码进行运算..为什么要学它?其设 ...
- vba中MsgBox的参数及用法
1.作用 在消息框中显示信息,并等待用户单击按钮,可返回单击的按钮值(比如“确定”或者“取消”).通常用作显示变量值的一种方式.2.语法 MsgBox(Prompt[,Buttons ...
- android sdk
android sdk 网站 为什么google 的网站都上不去. http://www.androiddevtools.cn/
- python matplotlib
背景: 1)数据可视化 目前还处于python入门阶段,主要想通过numpy.matplotlib进行数据可视化. 安装: 操作系统:windows7 1)python2.7 安装numpy.matp ...
- Spark核心—RDD初探
本文目的 最近在使用Spark进行数据清理的相关工作,初次使用Spark时,遇到了一些挑(da)战(ken).感觉需要记录点什么,才对得起自己.下面的内容主要是关于Spark核心-RDD的相关 ...