import 'style.css' doesnt work

[davistsin]

webpack folder, react.webpack.js, module.rules add css-loader, sample code below:

module.exports = {
  resolve: {
    extensions: ['.tsx', '.ts', '.js'],
    mainFields: ['main', 'module', 'browser']
  },
  entry: path.resolve(rootPath, 'src', 'App.tsx'),
  target: 'electron-renderer',
  devtool: 'source-map',
  module: {
    rules: [
      {
        test: /\.(js|ts|tsx)$/,
        exclude: /node_modules/,
        use: {
          loader: 'babel-loader'
        }
      },
      {
        test: /\.less$/,
        use: [
          'style-loader',
          'css-loader',
          'less-loader'
        ]
      },
      {
        test: /\.css$/,
        use: [
          'style-loader',
          'css-loader'
        ]
      },
    ]
  },
  devServer: {
    contentBase: path.join(rootPath, 'dist/renderer'),
    historyApiFallback: true,
    compress: true,
    hot: true,
    port: 5088,
    publicPath: '/'
  },
  output: {
    path: path.resolve(rootPath, 'dist/renderer'),
    filename: 'js/[name].js',
    publicPath: './'
  },
  plugins: [
    new HtmlWebpackPlugin()
  ]
}

dont forget: yarn add style-loader css-loader. If you want to use less: yarn add style-loader css-loader less less-loader

suggest you learn webpack knowledge

[zoeleu]

Thanks, but I am now using create-nw-react-app, because for what I needed, nw.js was better.

Em sáb., 19 de set. de 2020 às 02:07, 覃大畅 notifications@github.com escreveu:

webpack folder, react.webpack.js, module.rules add css-loader, sample code below:

module.exports = { resolve: { extensions: ['.tsx', '.ts', '.js'], mainFields: ['main', 'module', 'browser'] }, entry: path.resolve(rootPath, 'src', 'App.tsx'), target: 'electron-renderer', devtool: 'source-map', module: { rules: [ { test: /.(js|ts|tsx)$/, exclude: /node_modules/, use: { loader: 'babel-loader' } }, { test: /.less$/, use: [ 'style-loader', 'css-loader', 'less-loader' ] }, { test: /.css$/, use: [ 'style-loader', 'css-loader' ] }, ] }, devServer: { contentBase: path.join(rootPath, 'dist/renderer'), historyApiFallback: true, compress: true, hot: true, port: 5088, publicPath: '/' }, output: { path: path.resolve(rootPath, 'dist/renderer'), filename: 'js/[name].js', publicPath: './' }, plugins: [ new HtmlWebpackPlugin() ] }

dont forget: yarn add style-loader css-loader. If you want to use less: yarn add style-loader css-loader less less-loader

suggest you learn webpack knowledge

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/diego3g/electron-typescript-react/issues/20#issuecomment-695165801, or unsubscribe https://github.com/notifications/unsubscribe-auth/AQRVPRPGBBJVJUTW4243WA3SGQ4CNANCNFSM4QJVTZXQ .