node系列項目管理

1. npm node後端依賴插件管理

安裝玩node一起安裝了，

   常用命令：npm init

             npm install

             npm install somedep --save

             npm uninstall somedep

2.bower 前端插件管理

  安裝：npm install -g bower

  安裝前端插件：bower install angular

                bower install bootstracp

  文件：

       .bowerrc           

               

           {
                  "directory": "src/bower_components"
                }

        bower.json

         

{
  "name": "static",
  "version": "0.0.0",
  "license": "MIT",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "test",
    "tests"
  ],
  "dependencies": {
    "font-awesome": "~4.1.0",
    "angular": "~1.2.22",
    "bootstrap": "~3.2.0"
  }
}

      

3.grunt 前端構建工具，類型ant

 安裝：npm uninstall -g grunt

       npm install -g grunt_cli

       npm install grunt --save-dev

  運行：grunt

   文件：Gruntfile.js

      

module.exports = function (grunt) {
    'use strict';

    // 構建任務配置
    grunt.initConfig({

        // 參數
        pkg: grunt.file.readJSON('../package.json'),
        banner: '/**\n' +
            '* Ether007 v<%= pkg.version %> by @zensh\n' +
            '* Copyright <%= grunt.template.today("yyyy") %> <%= pkg.author.email %>\n' +
            '*/\n',
        dist: '../dist',

        // 任務配置


        clean: {
            dist: [
                'dist/css',
                'dist/fonts',
                'dist/img',
                'dist/js',
                'dist/md',
                'dist/tpl'
            ]
        },
        //壓縮源代碼
        uglify: {
            options: {
                banner: '<%= banner %>'
            },
            bootstrap: {
                dest: 'dist/js/bootstrap.js',
                src: ['src/bower_components/bootstrap/dist/js/bootstrap.js']
            },
            angular: {
                dest: 'dist/js/angular-all.min.js',
                src: [
                    'src/bower_components/angular/angular.js'
                ]
            },
            app: {
                dest: 'dist/js/<%= pkg.name %>.min.js',
                src: [
                    'src/js/app.js'
                ]
            }
        },
        recess: {
            dist: {
                options: {
                    compile: true,
                    compress: true
                },
                dest: 'dist/css/<%= pkg.name %>.min.css',
                src: [
                    'src/css/main.css'
                ]
            }
        },
        copy: {
            tmp: {
                expand: true,
                flatten: true,
                dest: 'dist/tmp/',
                src: ['src/tmp/*.html']
            },
            index: {
                expand: true,
                flatten: true,
                dest: 'dist/',
                src: ['src/*.html']
            },
            fonts: {
                expand: true,
                flatten: true,
                dest: 'dist/fonts/',
                src: ['src/bower_components/font-awesome/fonts/*']
            },
            css: {
                expand: true,
                flatten: true,
                dest: 'dist/css/',
                src: ['src/bower_components/font-awesome/css/font-awesome.min.css',
                    'src/bower_components/bootstrap/dist/css/bootstrap.css']
            },
            jquery: {
                expand: true,
                flatten: true,
                dest: 'dist/js/',
                src: ['src/bower_components/jquery/dist/jquery.min.js']
            },
            img: {
                expand: true,
                flatten: true,
                dest: 'dist/img/',
                src: ['src/img/*']
            }
        }
    });
//end  init

    //加載Grunt插件
    grunt.loadNpmTasks('grunt-contrib-clean');
    // grunt.loadNpmTasks('grunt-contrib-htmlmin');
    // grunt.loadNpmTasks('grunt-contrib-imagemin');
    grunt.loadNpmTasks('grunt-contrib-copy');
    // grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    //grunt.loadNpmTasks('grunt-hash-url');
    grunt.loadNpmTasks('grunt-recess');

    // 默認任務
    grunt.registerTask('default', [ 'clean', 'uglify', 'copy', 'recess']);
};