了解平均值堆栈并整合uglify.js和手写笔

Question

我刚开始使用MEAN堆栈（https://github.com/linnovate/mean），所以我很确定我的问题对专家来说看起来非常基础，所以我事先表示歉意！

虽然我认为这将是此堆栈已提供的功能的补充，但我无法集成Uglify.js和stylus

[也有人已经问过this，但对于服务器和公共视图，至少出于标准化的考虑，对服务器和公共视图都使用Jade模板对我来说很有意义。

我曾尝试过使用grunt文件和server.js，重命名了一些文件，但是到目前为止，我设法做到的是打破原始项目...

提前感谢！

EDIT：刚刚发现了这个项目的分支，该项目刚刚添加了对供公众观看的Jade模板的支持：https://github.com/tutley/mean

Answer 1

这篇文章解释了如何将手写笔预处理集成到MEAN堆栈：http://to-s.tk/integrate-stylus-to-the-mean-stack/

简短版：

• 将public/css移至新的assets/stylesheets并将所有.css文件重命名为.styl

• 安装grunt-contrib-stylus到npm的package.json，同时作为dev和运行时依赖项。

-在Gruntfile中配置手写笔编译

// ...
grunt.initConfig({
    // ...
    watch: {
        // ...
        stylus: {
            files: ['assets/stylesheets/**/*.styl'],
            tasks: ['stylus']
        },
        // ...
    },
    // ...
    stylus: {
        compile: {
            options: {
                paths: ['assets/stylesheets/**']
            },
            files: [{
                dest: 'public/css/',
                cwd: 'assets/stylesheets/',
                src: '*.styl',
                ext: '.css',
                expand: true
            }]
        }
    },
    // ...
});
//...
//Load NPM tasks
// ...
grunt.loadNpmTasks('grunt-contrib-stylus');
// ...

• 使用common.styl语句导入查看@require中的手写笔文件（或任何子手写笔）>

• 在substylesheets中删除对视图或其他head.jade的引用。

然后，只要assets/stylesheets/*.styl正在运行，所有public/css/*.css文件都应自动编译为grunt。要不依赖于watch来触发编译，可以运行grunt stylus。