vue3-quickstart-cli/dist/plugins/scss.js

一个用于快速创建 Vue3 项目的脚手架工具。

import path from 'path';
import fs from 'fs-extra';
import chalk from 'chalk';
const plugin = {
    name: 'scss',
    apply(targetDir, pkg) {
        pkg.devDependencies = pkg.devDependencies || {};
        pkg.devDependencies['sass'] = '^1.69.5';
        pkg.devDependencies['sass-embedded'] = '^1.69.5';
        const assetsDir = path.join(targetDir, 'src/assets');
        fs.ensureDirSync(assetsDir);
        fs.writeFileSync(path.join(assetsDir, 'main.scss'), '$color: #42b983;\nbody { color: $color; }\n');
        const mainTs = path.join(targetDir, 'src/main.ts');
        const mainJs = path.join(targetDir, 'src/main.js');
        let mainPath = fs.existsSync(mainTs) ? mainTs : mainJs;
        if (fs.existsSync(mainPath)) {
            let mainCode = fs.readFileSync(mainPath, 'utf-8');
            if (!mainCode.includes('assets/main.scss')) {
                mainCode = `import './assets/main.scss';\n` + mainCode;
            }
            fs.writeFileSync(mainPath, mainCode, 'utf-8');
        }
        console.log(chalk.green('已集成 SCSS！'));
    }
};
export default plugin;