django项目：创建项目

        最近想通过django搭建一个项目，为了不半途而废，决定记录一下搭建项目的整个过程。

1.通过pycharm创建一个django项目

创建项目

2.新项目计划

        项目初始结构

初始结构

制作过程

        修改之后的结构

 修改之后的结构

        3.使用gulp管理前端项目

计划

初始化gulp

加上 --save-dev会自动保存到package.json文件的devDependencies中

初始化gulp

下载相应的gulp文件

下载

下载后的package.json文件

package.json

4.完善gulpfile.js

var gulp = require("gulp");

var cssnano = require("gulp-cssnano");

var rename = require("gulp-rename");

var uglify = require("gulp-uglify");

var concat = require("gulp-concat");

var cache = require("gulp-cache");

var imagemin = require("gulp-imagemin");

var bs = require("browser-sync").create();

var path = {

'html':'./templates/**/',

    'css':'./src/css/',

    'js':'./src/js/',

    'images':'./src/images/',

    'cs_dist':'./dist/css/',

    'js_dist':'./dist/js/',

    'images_dist':'./dist/images/'

}

//定义一个html的任务

gulp.task("html",function(){

gulp.src(path.html +'*.html')//后缀名为html的文件名

        .pipe(bs.stream())//重新加载

});

//定义一个css的任务

gulp.task("css",function(){

gulp.src(path.css +'*.css')//后缀名为css的文件名

        .pipe(cssnano())//压缩css

        .pipe(rename({"suffix":".min"}))//改后缀名

        .pipe(gulp.dest(path.css_dist))

.pipe(bs.stream())

});

//定义一个js的任务

gulp.task("js",function(){

gulp.src(path.js +'*.js')//后缀名为js的文件名

        .pipe(uglify())//压缩css

        .pipe(gulp.dest(path.js_dist))

.pipe(bs.stream())

});

gulp.task("images",function(){

gulp.src(path.js +'*.*')

.pipe(cache(imagemin()))//缓存图片

        .pipe(gulp.dest(path.images_dist))

.pipe(bs.stream())

})

//定义监听文件修改

gulp.task("watch",function(){

gulp.watch(path.css +'*.css', ['css']);

    gulp.watch(path.html +'*.html', ['html']);

    gulp.watch(path.js +'*.js', ['js']);

    gulp.watch(path.images +'*.*', ['images']);

})

//初始化brower-sync任务(实时监听修改)

gulp.task("bs",function(){

bs.init({

'server':{

"baseDir":'./'

        }

})

})

//创建默认任务

gulp.task("default",['bs','watch']);

5.测试

测试

    django前端项目创建成功