Skip to content

Can I use webpack resolve.extensions = [".css"] and use import './table' instead of './table.css' in js #295

Open
@yinsang

Description

Course
image

// webpack.config.js

  resolve: {
    extensions: ['*', '.js', '.json', '.jsx', '.tsx', '.ts', '.css', '*.css', '.scss'],
  },

// RuntimeStyleResolution.js

/**
 * @file Demonstrates runtime "styleName" resolution.
 * @see https://github.com/gajus/babel-plugin-react-css-modules#runtime-stylename-resolution
 */

import React from 'react';
import './table';

export default () => {
  return <div styleName='table'>
    <div styleName='row'>
      <div styleName={'cell' + (Math.random() > 0.5 ? ' yellow' : '')}>A2</div>
      <div styleName={'cell' + (Math.random() > 0.5 ? ' yellow' : '')}>B2</div>
      <div styleName={'cell' + (Math.random() > 0.5 ? ' yellow' : '')}>C2</div>
    </div>
  </div>;
};

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions