Gulp只观看主要的scss，而不观看部分

Question

我在设置gulp任务以自动查看我的scss更改时遇到问题。我正在创建一个快速应用程序，我有一个像这样的文件夹：

首先，我在终端import * as React from "react"; import * as ReactDOM from "react-dom"; class App extends React.Component<{}, { text: string }> { private textarea: React.RefObject<HTMLTextAreaElement>; constructor(props) { super(props); this.state = { text: "" }; this.textarea = React.createRef(); } handleChange(e: React.ChangeEvent<HTMLTextAreaElement>) { const cursor = e.target.selectionStart; this.setState({ text: e.target.value }, () => { if (this.textarea.current != null) this.textarea.current.selectionEnd = cursor; }); } render() { return ( <textarea ref={this.textarea} value={this.state.text} onChange={this.handleChange.bind(this)} /> ); } } ReactDOM.render(<App />, document.getElementById("root")); 中运行gulp任务。基本上，当我添加诸如gulp watch之类的另一个CSS条件并保存我的局部变量时，它不会将其转换为CSS。它仅适用于main.scss文件。但是使用body {height: 25%;}（部分scss）却没有。

这是我的gulpfile.js

_

我尝试更改 var gulp = require('gulp'); var sass = require('gulp-sass'); gulp.task('sass', function(){ return gulp.src('public/sass/**/*.scss') .pipe(sass({outputStyle: 'compressed'})) // Using gulp-sass .pipe(gulp.dest('public/stylesheets')) }); gulp.task('watch', function(){ gulp.watch('public/sass/**/*.scss', gulp.parallel('sass', function(done) { // do more stuff done(); })) }) ，*.scss，**/*.scss之类的全局字符，但是它不起作用。

请帮助

Answer 1

您的代码对我来说还不错。您是否导入了所有这样的局部变量？

main.scss

@import 'auth';
@import 'blog-show';

/* more imports ... */