Question

人。目前我在Egghead.io上学习React，我发现在我的js中导入css文件时出现问题。这是我在导入css的js文件中的代码。 style.css当前位于同一目录中。我不知道Webpack是否足以弄清楚如何解决这个问题。

import React from 'react';
import "style.css";
class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      input: '/* add your jsx here */',
      output: '',
      err: ''
    }
  }
  update(e) {
    let code = e.target.value;
    try{
      this.setState({
        output: window.Babel
                .transform(code, {presets: ['es2015', 'react']})
                .code,
        err: ''
      })
    }
    catch(err) {
      this.setState({err: err.message})
    }
  }
  render() {
    return (
      <div>
        <header>{this.state.err}</header>
        <div className="container">
          <textarea onChange={this.update.bind(this)} 
                    defaultValue={this.state.input}/>
          <pre>
            {this.state.output}
          </pre>
        </div>
      </div>
    )
  }
}

export default App

错误的文本是：编译失败。

./src/App.js中的错误找不到模块：C：\ Front-end \ projects \ React \ Reactapp \ src

中的'style.css'

@ ./src/App.js 14：0-20

Answer 1

你导入了这样的文件

import "style.css"

这告诉Webpack查找名为style.css的模块，其方式与查找上面React模块导入行的方式相同

要正确导入您的样式，请始终使用导入位置的相对路径，如下所示

import "./style.css"

Webpack热启动服务器“无法找到模块”

1 个答案: