Tengo una aplicación Create React escrita en Typescript, la llamaré MyApp. Quiero ejecutar esta aplicación dentro de una aplicación React ya existente, la llamaré ExistingApp.
Me gustaría usarlo de la siguiente manera:
import App from "node_modules/@MyApp/src" function ExistingApp() { return ( <div className="App"> <App /> </div> ); } export default ExistingApp;Me gustaría hacer esta compilación/Transpilación usando Webpack. Me gustaría que se mantuviera la estructura de carpetas sin agrupar todo en un solo archivo JS. He logrado lograr el resultado deseado con
tsc --module commonjs --outDir distSin embargo, mis archivos .scss no se copian en la carpeta dist. la carpeta dist solo contiene los archivos js transferidos.
La siguiente solución es hacer que webpack use Sass, con empaquetado. Si no desea agrupar, no usaría el paquete web en absoluto.
npm i --save-dev sass-loader node-sass mini-css-extract-plugin css-loader style-loader { test: /\.(s(a|c)ss)$/, use: [MiniCssExtractPlugin.loader,'css-loader', 'sass-loader'] } import * as MiniCssExtractPlugin from "mini-css-extract-plugin"O
const MiniCssExtractPlugin = require("mini-css-extract-plugin") { test: /\.(s(a|c)ss)$/, use: ['style-loader','css-loader', 'sass-loader'] }