web-starter-sx is example of different approach of provide transpiling Stylus and JSX using Gulp 4
├── dist/ # Folder for compiled output
├── src/ # Application source code
│ ├── app/ # JSX source code
│ │ └── concat.json # *.jsx | *.js concatenate sequence
│ ├── style/ # Stylus source code
│ │ └── main.styl # Stylus entry point
│ └── index.html # index.html include js, and css files
├── node_modules/ # 3rd-party libraries and utilities
├── gulpfile.js # Gulpfile
└── package.json # The list of project dependencies and NPM scripts- When save the
src/app/**/*.jsxfile, gulp transpiling all .jsx files to .js and concatenate them together as specified insrc/app/concat.json - When save the
src/app/**/*.stylfile, gulp transpiling .styl files whose was included inmain.stylentry point file.
git clone https://github.com/mikejav/web-starter-sx
npm installnpm run dev # Compiles the app and opens it in a browser with "live reload"
npm run build # Just compiles the appyou can simply add vendor js files by adding it at the begining of the concat.json file:
[
"../../node_modules/path/to/framework.file",
"main.jsx"
]but make sure that you npm install your vendor library before include it.