Not loaded server style in Node.js application

Asked

Viewed 67 times

2

I have a question. I’m using the github pages to develop a website using Node.js. In my host, styles load and I can view them normally in the browser.

However, when I try to see the application to 'live', after the deploy, I realize that styles do not carry.

Follow here important codes:

webpack.config.js

 module.exports = [{
  entry: './app.scss',
  output: {
    // This is necessary for webpack to compile
    // But we never use style-bundle.js
    filename: 'style-bundle.js',
  },
  module: {
    rules: [
      {
        test: /\.scss$/,
        use: [
          {
            loader: 'file-loader',
            options: {
              name: 'bundle.css',
            },
          },
          { loader: 'extract-loader' },
          { loader: 'css-loader' },
          { loader: 'sass-loader' },
        ]
      }
    ]
  },
}];

index.html

<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="bundle.css">
  </head>
  <body>
    <p>Hello world!</p>
  </body>
</html>

scss app.

body {
  color: blue;
  background: #f1f1f1;
}

Here my repository if you need to access other files: https://github.com/vnsqz/vnsqz.github.io

Link to the live': https://vnsqz.github.io

I see you have the scss app. and the Bundle.css and I end up getting a little confused on how the flow works. maybe I should add some component that transforms the scss in css, or just listening to it?

html css node.js scss
No answers

Browser other questions tagged html css node.js scss

You are not signed in. Login or sign up in order to post.