если новый — то тс

вот это как оказалось без разницы

одинаково больно и то, и другое

:D

Кто дружил вебпак 2 бета 25 с постцсс лоадером и экстракт плагином?

С экстракт плагином там как я понял вообще конченная ситуация

они наполовину сделали поддержку нового api конфига, а наполовину оставили старым

например, в него не options надо, как по новому, а query, как по старинке

причем если тупо строку передать с квери параметрами, как в старой версии можно было, сейчас не получилось - экстракт плагин даже не распознал опции лоадеров

вот пример, который я наванговал и который заработал :) { test: /\.sass$/, loader: extractCSS.extract({ fallbackLoader: 'style', loader: [ { loader: 'css', query: { modules: true, importLoaders: 2, sourceMap: true, } }, { loader: 'autoprefixer', query: { browsers:'last 2 version', } }, { loader: 'sass', query: { indentedSyntax: true, // compile .sass syntax instead of .scss includePaths: [path.resolve(__dirname, '..', "./src")] } }, ] }) },

обрати внимание, что после test, я передаю не use, как надо, а loader. На этом я прямо долго завис когда переходил на второй вебпак

Славная экосистема

Бодрая

обрати внимание, что после test, я передаю не use, как надо, а loader. На этом я прямо долго завис когда переходил на второй вебпак

Спасибо, попробую

Из postcss плагинов пытаюсь пока только cssnext завести и postcss-import

С последним тоже беда

У реакт-роутера есть набор объектов и в документации они описаны. А как мне в девтулз хрома узнать тип объекта, чтобы посмотреть в доке его описание?

установить react-devtools chrome extension

вот пример, который я наванговал и который заработал :) { test: /\.sass$/, loader: extractCSS.extract({ fallbackLoader: 'style', loader: [ { loader: 'css', query: { modules: true, importLoaders: 2, sourceMap: true, } }, { loader: 'autoprefixer', query: { browsers:'last 2 version', } }, { loader: 'sass', query: { indentedSyntax: true, // compile .sass syntax instead of .scss includePaths: [path.resolve(__dirname, '..', "./src")] } }, ] }) },

{ test: /\.css$/, loaders: ExtractTextPlugin.extract({ fallbackLoader: 'style-loader', loader: [ { loader: 'css-loader', query: { importLoaders: 1, modules: true, localIdentName: "[path][name]--[local]--[hash:base64:5]" } }, { loader: 'postcss-loader', query: { plugins: [ require("postcss-import")({path: ['node_modules', path.resolve(process.cwd(), 'src')]}), require("postcss-focus")(), require("postcss-cssnext")({ browsers: "last 2 versions", }), ] } } ] }), }, не взлетело, в общем. Наверное, откачусь на вебпак 1

@znack в общем, я заюзал LoaderOptionsPlugin в него отдал объект { test: /\.css$/, options: { postcss: postcssPlugins, context: __dirname, }, } postcssPlugins здесь это const postcssPlugins = () => [ require("postcss-import")({path: ['node_modules', path.resolve(process.cwd(), 'src')]}), require("postcss-focus")(), require("postcss-cssnext")({ browsers: "last 2 versions", }), require("postcss-reporter")(), ]; Так вот пока костыльно работает. алсо, отсюда взял наводку. а экстракт передаю как options, а не query

С последним тоже беда

какая? мб у меня тоже самое

какая? мб у меня тоже самое

https://github.com/postcss/postcss-import/issues/207

обрати внимание, что после test, я передаю не use, как надо, а loader. На этом я прямо долго завис когда переходил на второй вебпак

почему "как надо"? тут можно же по-разному https://webpack.js.org/configuration/module/#rule-loader: Rule.loader is a shortcut to Rule.use: [ { loader } ]

Да, это просто алиас

@znack в общем, я заюзал LoaderOptionsPlugin в него отдал объект { test: /\.css$/, options: { postcss: postcssPlugins, context: __dirname, }, } postcssPlugins здесь это const postcssPlugins = () => [ require("postcss-import")({path: ['node_modules', path.resolve(process.cwd(), 'src')]}), require("postcss-focus")(), require("postcss-cssnext")({ browsers: "last 2 versions", }), require("postcss-reporter")(), ]; Так вот пока костыльно работает. алсо, отсюда взял наводку. а экстракт передаю как options, а не query

я сделал с postcss.config.js https://github.com/michael-ciniawsky/postcss-load-config

но там забавно все выглядит: module.exports = ctx => ({ map: ctx.env === 'development' ? ctx.map : false, from: ctx.form, to: ctx.to, plugins: { stylelint: {}, 'postcss-size': {}, 'postcss-position': {}, 'postcss-font-magician': {}, precss: {}, cssnano: ctx.env === 'production' ? {} : false, }, });

+ extract с webpack-combine-loaders (combineLoaders): loader: ExtractTextPlugin.extract({ fallbackLoader: 'style', loader: combineLoaders([ <my-loaders> ]), }),

где: "extract-text-webpack-plugin": "2.0.0-beta.4", тк ему надо именно loader, 1

алсо почему-то импортирует криво ещё

.someGlobalClass { }.styles--test--TTjGm { background-color: rgb(102, 51, 153); color: rgba(18, 52, 86, 0.47059); }

про postcss-import спасибо, откатился тоже на 8.0.2, работает

про postcss-import спасибо, откатился тоже на 8.0.2, работает

а вот пример выше, это норма?

как их отделить?

я, честно говоря, даже не знаю: в дев окружении – сорсмапы, а в прод и так все в одну строчку с cssnano & uglify

Гайз, а может кто-то пояснить, почему реакт требует key именно в циклических выводах?

https://facebook.github.io/react/docs/reconciliation.html#keys

Может он весь вывод цикла/мапа помещает в какой-то блок, а потом его уже один раз вставляет в дом? В таком случае - понятно, но это догадки

https://facebook.github.io/react/docs/reconciliation.html#keys

Спасибо

Ещё вопрос, про фичу второго вебпака. System.import если с этим асинхронно подгружать компоненты, то хотрилоад не работает, сталкивался кто-нибудь?

https://github.com/gaearon/react-hot-loader/issues/303

Всем привет. Вопрос про экосистему React + Redux. Используете ли какие-нибудь middleware (redux-thunk, redux-promise)? Как гоняете запросы в action'ах? Разрешаете промисы в action'ах или прокидываете их прямо в reducer, где они разрешаются через middleware? Исполльзовали ли axios для запросов и какое к нему отношение?

Все как здесь прописали

http://redux.js.org/docs/advanced/AsyncFlow.html

Всем привет. Вопрос про экосистему React + Redux. Используете ли какие-нибудь middleware (redux-thunk, redux-promise)? Как гоняете запросы в action'ах? Разрешаете промисы в action'ах или прокидываете их прямо в reducer, где они разрешаются через middleware? Исполльзовали ли axios для запросов и какое к нему отношение?

axios тоже https://gist.github.com/anonymous/aad2dd393dfaffcc3836dbc117c8c5df

Кто-нибудь считает axios избыточным и вместого него лучше использовать js fetch?

я использую собственную обертку над fetch

как и многие здесь

как и многие здесь

Спасибо за ответ, это ценная информация)

я использую собственную обертку над fetch

А redux-promise используешь?

thunk хватает на все

лично мне

а так redux-promise норм тема и многие используют, я думаю

я использую собственную обертку над fetch

cancel в ней есть? (любопытство)

да

недавно появился, правда

а что за обертка?

2 файла - класс для создания адаптеров к сервисам по path (адаптер = конфигурируемая фигня, которая работает с fetch и типами запросов) и фабрика адаптеров, привязанная к конкретному апи (беку, апи каких-нибудь соцсетей или чему-то подобному)

200 строк кода по сути

и фигня всякая по вкусу типа коннекта к redux store

если требуется

я просто какое-то время не следил за https://github.com/whatwg/fetch/issues/27

там же нет cancel еще

для cancel использую xhr, то есть не все запросы cancellable

только для каких-то конкретных, но это пока такая топорная реализация в рамках задачи, не особо изучал эту тему

а, понял, спасибо скорее всего будет fetch(request, token), https://github.com/zenparsing/es-cancel-token, еще этот https://github.com/tc39/proposal-cancelable-promises

Кто-то работал с react в salesforce?

Под второй вебпак кто-нибудь писал кастом лоадеры?

nvm

у кого есть под рукой простейший пример с эрроу фанкшн проперти инитиалайзером вместо бинда в конструкторе?

поделитесь плз

самый самый простой

или там статью откуда скопировать можно

лень самому пример писать :ь

лень самому пример писать :ь

https://babeljs.io/blog/2015/06/07/react-on-es6-plus