Question

我见过很多像这样的问题，但我没有看到适用于我案件的答案，所以我必须发表自己的问题。

我在我的项目中使用了React，Node.js和Webpack，但是前端找不到style / style.css文件，并在加载页面时给出了404错误。

我的项目文件夹结构类似于

├── root
│   ├── client
│   │   ├──src
│   │   │  ├──actions
│   │   │  ├──components
│   │   │  ├──reducers
│   │   │  ├──index.js
│   │   │
│   │   ├──style
│   │   │  ├──style.css
│   │   │
│   │   ├──index.html
│   │
│   ├──server
│      ├──server.js
│   
├── package.json
├── webpack.config.js

我的index.html

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="/style/style.css" type="text/css"/>
    <link 
      rel="stylesheet"
      href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" 
      integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" 
      crossorigin="anonymous"
    >
    <script 
      src="https://code.jquery.com/jquery-3.1.1.slim.min.js" 
      integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" 
      crossorigin="anonymous"
    >     
    </script>
    <script 
      src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" i
      ntegrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" 
      crossorigin="anonymous"
    >  
    </script>
    <script 
      src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" 
      integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" 
      crossorigin="anonymous"
    >
    </script>
  </head>
  <body>
    <div class="container"></div>
  </body>
  <script src="/bundle.js"></script>
</html>

和我的webpack.config.js

const HtmlWebpackPlugin = require('html-webpack-plugin');
const HtmlWebpackPluginConfig = new HtmlWebpackPlugin({
  template: './client/index.html',
  filename: 'index.html',
  inject: 'body'
});

module.exports = {
  entry: ['./client/src/index.js'],
  output: {
    path: __dirname + '/client',
    publicPath: '/',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      { test: /\.js$/, loader: 'babel-loader', exclude: /node_modules/ },
      { test: /\.jsx$/, loader: 'babel-loader', exclude: /node_modules/ }
    ]
  },
  plugins: [HtmlWebpackPluginConfig]
};

似乎src甚至bootstrap中的所有组件都已正常加载，但只是style/style.css没有加载到我的页面样式。

如果有人能够看到我在网页上加载style/style.css的错误，我会非常感激。

谢谢，

localhost：8080 / style / style.css 404错误

0 个答案: