node 将 scss 转换成 css 的步骤

在Node.js环境中将SCSS（Sassy CSS）转换为CSS，通常会使用一种名为`node-sass`（现在更推荐使用`sass-loader`与`webpack`或`create-react-app`结合）的工具，如果你是在Web开发框架如React中，流程可能会是这样的：

1. **安装依赖**:
- 安装Node.js环境，然后通过npm或yarn管理工具安装`node-sass`、`@babel/core`（如果使用Babel处理ES6+语法）、`@babel/preset-env`（用于转码）以及`css-loader`和`sass-loader`（处理SCSS到CSS的转换）。

   npm install node-sass --save-dev
   npm install sass-loader css-loader style-loader --save-dev (对于Webpack)
   # 或者在Yarn项目中
   yarn add node-sass sass-loader css-loader style-loader --dev

2. **配置构建工具**:
- 如果你在使用Webpack，需要在配置文件`webpack.config.js`中添加相关loader规则，例如：

   module.exports = {
     //...
     module: {
       rules: [
         {
           test: /\.scss$/i,
           use: ['style-loader', 'css-loader', 'sass-loader'],
         },
       ],
     },
     //...
   };

3. **编写SCSS文件**:
- 创建或编辑`.scss`文件，编写你的样式，并使用SASS特性，比如变量、嵌套、混合等。

4. **运行转换**:
- 运行Webpack或其他构建工具，它会在编译过程中自动将SCSS文件转换成CSS。如果是命令行直接使用`node-sass`, 你可以这样做：

   node_modules/.bin/node-sass input.scss output.css --output-style compressed

5. **查看结果**:
- 查看生成的`output.css`文件，确认SCSS已成功转换为CSS。