美文网首页
django项目:创建项目

django项目:创建项目

作者: xgz_pmx | 来源:发表于2018-09-23 13:14 被阅读0次

            最近想通过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前端项目创建成功

    相关文章

      网友评论

          本文标题:django项目:创建项目

          本文链接:https://www.haomeiwen.com/subject/vyoxoftx.html