По урокам И. Кантора (хотя я понимаю что они уже старые) пробовал разобраться со сборкой файлов + попутно в интернете серфил инфу, так как уроки уже старенькие, но безуспешно.
В общем вот конфиг вебпака:
'use strict';
const NODE_ENV = process.NODE_ENV || 'development';
const webpack = require('webpack');
const path = require('path');
module.exports = {
context: path.resolve(__dirname, 'frontend'),
entry: {
main: './main'
},
output: {
path: path.resolve(__dirname, 'public'),
publicPath: '/',
filename: '[name].js',
library: '[name]'
},
watch: NODE_ENV === 'development',
watchOptions: {
aggregateTimeout: 100
},
devtool: NODE_ENV === 'development' ? 'cheap-inline-module-source-map' : null,
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
],
module: {
rules: [
{
test: /\.js$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: 'babel-loader',
options: {
presets: ['env'],
plugins: ['transform-runtime']
}
}
},
{
test: /\.css$/,
use: ['css-loader']
},
{
loader: 'file-loader',
query: {
useRelativePath: true
}
}
],
}
};
вот такая структура:
это код который находится в menu/index.js, который подключается в main.js
import './menu.css';
export default class Menu {
constructor(options) {
this.elem = document.getElementById('menu');
this.title = this.elem.querySelector('.title');
this.title.onclick = () => this.elem.classList.toggle('open');
}
}
и на выходе, в папку public попадает такой файл fc9dd5daeb344e070521a4e603103ca7:
его содержимое:
'use strict';
import Menu from './menu';
let pandaMenu = new Menu({
title: 'Меню панды',
items: [{
text: 'яйца',
href: '#eggs'
}, {
text: 'Мясо',
href: '#meat',
}]
});
document.body.appendChild(pandaMenu.elem);
замечу, что css-loader и file-loader у меня подключены не так как в скринкасте, дело в том, что как у Ильи они не работают, я ставил по докам
https://webpack.js.org/loaders/css-loader/ и
https://github.com/webpack-contrib/file-loader.
подскажите пожалуйста, почему у меня не получается файлы собрать? что я упускаю?
хочу создать проект с помощью вебпака, но это 2х дневная головная боль со сборкой файлов...