@hollanditkzn

Как подключить стили materialize в webpack?

Я раньше использовал cdn но в вебапке как я знаю лучше использовать через npm такие библеотеки. Не доконца понимаю webpack и тут у меня были всегда проблемы с подключением в проектах node js.
Вот мой код. webpack.config.js
const path = require('path');
module.exports = {
    entry: './src/header.js',
    output: {
        path: path.resolve(__dirname, 'public'),
        filename: 'bundle.js',
    },
    module: {
        rules: [
            {
                test: /\.jsx$/,
                use: ['babel-loader'],
                exclude: /\/node_module\//
            },
            {
                test: /\.css$/,
                use: [
                    'style-loader',
                    'css-loader'
                ]
            },
            {
                test: /\.(png|svg|jpg|gif)$/,
                use: ['file-loader']
            },
            {
                test: /\.(woff|woff2|eot|ttf|otf)$/,
                use: ['file-loader']
            }
        ]
    },
    devtool: 'source-map',
    context: __dirname,
    watch: true,
    watchOptions: {
        aggregateTimeout: 300
    }
};

В layout я подключаю его
doctype html
html
  head
    title=title
    meta(name="viewport", content="width=device-width, initial-scale=1.0")
    link(href='bundle.js')
    ...

И в самом файле src/header.js
import 'materialize-css'
И в консоле
C:\OpenServer\domains\crm_nodejs1>webpack

Webpack is watching the files…

Hash: edaa98da906a12b4fd15
Version: webpack 3.8.1
Time: 1135ms
Asset Size Chunks Chunk Names
bundle.js 724 kB 0 [emitted] [big] main
bundle.js.map 904 kB 0 [emitted] main
[1] ./src/header.js 24 bytes {0} [built]
[3] (webpack)/buildin/module.js 495 bytes {0} [built]
[4] (webpack)/buildin/amd-options.js 80 bytes {0} [built]
+ 3 hidden modules
Но стили не подключились
  • Вопрос задан
  • 334 просмотра
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы