Цитата:
Цитата:
|
Erolast, похоже, что на сегодня слишком много инфы, завтра перечитаю,спасибо).
|
Объясните, как работает file-loader.
Допустим загружаем картинки в папку assets/images module: { loaders: [ // ... { test: /\.(jpg|gif|png|svg)$/i, loader: 'file?context=' + path.join('app', 'resources', 'images') + '&name=assets/images/[name].[hash].[ext]' }, ] } Alias для подключения бла-бла-бла.. resolve: { // ... alias: { images: path.join(_path, 'app', 'resources/images'), } }, Собственно, подключение какой-то картинки import React from 'react'; // испортим через alias import logo from 'images/logo.png'; class Logo extends React.Component { render() { return ( // а тут подключаем <img src={logo} alt="" /> ); } } export default Logo; Это имхо - дикое извращение, но оно работает.. Все хорошо хотя нет, вру, нифига не хорошо, хорошо только то, что загружает только использованные изоображения, а их подключение - это жесть. Но ладно - это прокатит в html, jade etc..., а что мне делать, если я захочу подключить это изоображение в стилях? =) Копипастить из src в dist?:D |
Цитата:
Цитата:
https://github.com/webpack/css-loader А вообще: http://webpack.github.io/docs/list-of-loaders.html Читай документацию, а не придумывай извращения. *** Что касается задач: WebPack - это сборщик модулей или сайта. Gulp/Grunt - запускальщик тасков. |
Ещё важно понимать, что по умолчанию WebPack всё тянет в собираемый файл, т.е. можно сделать полностью запускаемый Файл, который содержит в себе стили, вёрстку, логику, картинки (как бейс64) и т.д. но можно делать как обычно, т.е. сохранять всё по разным файлом, для этих задач есть:
https://github.com/webpack/file-loader |
Цитата:
Цитата:
Цитата:
https://github.com/rambler-digital-s...ck-boilerplate скину ссылку на файл с шаблоном, чтоб не ковырялся по всему репозиторию https://github.com/rambler-digital-s.../hello.jade#L6 Спасибо за ссылку, но html,css,file лоадеры я использовал, но видимо, не так как нужно=) |
Цитата:
|
Цитата:
|
Пытаюсь настроить react-hot-loader с webpack-dev-server. Все запускается, в консоли пишет, что апдейтится, но на самом деле - ничего не происходит. Даже webpack-dev-server не перезагружает...
лог консоли Цитата:
entry: { app: [ path.resolve('app', 'entry', 'index.jsx'), 'webpack/hot/only-dev-server' ], vendors: Object.keys(dependencies) } module: { loaders: [ { test: /\.(jsx|js)$/, exclude: path.resolve('node_modules'), loader:'react-hot!babel-loader' }, ] } Кто то сталкивался с таким? hot включен. пробовал добавить в ентри client: 'webpack-dev-server/client?http://localhost:3000' Решено Думал, что в настройках webpack-dev-server'a hot: trueравняется --hot либо new webpack.HotModuleReplacementPlugin() оказывается - нет. |
Вопрос про url-loader
Ничего страшного не будет (некорректное кодирование или еще что-то), если не указывать mimetype ? т.е вместо { test: /\.png$/, loader: 'url?limit=10000&mimetype=image/png' }, { test: /\.gif$/, loader: 'url?limit=10000&mimetype=image/gif' }, { test: /\.jpg$/, loader: 'url?limit=10000&mimetype=image/jpeg' } записать так { test: /\.(png|gif|jpg)/, loader: 'url?limit=10000' } |
Часовой пояс GMT +3, время: 05:11. |