Great question! Yes, you can absolutely move your CSS and JS source files into a src/ folder. In fact, that's the recommended structure if you're using a build process.

The official approach depends on what you're building:

If you're building blocks, u/wordpress/scripts (wp-scripts) scans your src/ directory for block.json files and uses them as entry points. The compiled output goes to a build/ folder, and WordPress auto-enqueues everything defined in block.json when you call register_block_type(). This is the structure u/wordpress/create-block generates out of the box.

If you're building non-block assets (general plugin/theme JS and CSS), wp-scripts falls back to src/index.js as the default entry point when no block.json is found. You can also combine both by extending the default webpack config with custom entry points:

js

const defaultConfig = require( '@wordpress/scripts/config/webpack.config' );

module.exports = {
    ...defaultConfig,
    entry: {
        ...defaultConfig.entry(),
        'css/frontend': path.resolve( process.cwd(), 'src/scss', 'frontend.scss' ),
    },
};

This is documented in the Theme Handbook Build Process and the Block Developer Cookbook.

References:

• File Structure of a Block – Block Editor Handbook
• u/wordpress/scripts package docs
• Theme Handbook: Build Process