angular - asp.net 核心，angular2 : should wwwroot folder contains scss and typescript files?

Question

我不明白在哪里放置我的 ts 和 scss 文件？ wwwroot 文件夹用于静态文件，但编译 ts 和 scss 文件。我是否应该在 wwwroot 及其外部保存类似的文件夹结构，然后将 css 和 js 文件复制到 wwwroot？

例如:


会不会太复杂了？似乎很难维护和导航。

Answer 1

Should I hold similar folder structure in wwwroot and outside it and then copy css and js files to wwwroot? [sic]

是的。那是一个好主意。

一旦你掌握了这一点，就可以做更复杂的任务，比如捆绑和缩小。

你的问题有很多很多可能的答案。也就是说，您的屏幕截图显示 gulpfile.js你可以使用 gulp执行以下操作:

构建你的 TypeScript 并放置 *.js输出到 wwwroot .

构建您的 SCSS 并放置 *.css输出到 wwwroot .

这里有一些资源可以帮助您入门。

A gulp plugin for very fast TypeScript compilation

Gulp plugin for sass

这是一个例子 gulpfile.js供您根据您的特定需求进行修改。

'use strict';

var gulp = require('gulp');
var tsb = require('gulp-tsb');
var sass = require('gulp-sass');

// create and keep compiler 
var compilation = tsb.create({
    target: 'es5'
});

gulp.task('tsc', function() {
    return gulp.src('./scripts/**/*.ts')
        .pipe(compilation()) // <- new compilation 
        .pipe(gulp.dest('./wwwroot/appScripts'));
});

gulp.task('sass', function () {
  return gulp.src('./sass/**/*.scss')
    .pipe(sass().on('error', sass.logError))
    .pipe(gulp.dest('./wwwroot/css'));
});

您需要对 npm 有一定的了解和 gulp .基本上，您将从命令行运行以下 gulp 任务。

gulp tsc     // to build typescript
gulp sass    // to build sass

他们会找到您的 *.ts和 *.scss文件，构建它们，并将它们保存到指定的目的地。