Телеграмм чат группы webpack

Size: a a a

Webpack — русскоговорящее сообщество

2021 January 19

The Fallen Phoenix in Webpack — русскоговорящее сообщество

Почему webpack останавливает сборку на ts ошибках, если у меня в tsconfig strictNullChecks: true (для ide), а в конфиге webpack strictNullChecks: false?

{
  test: /\.tsx?$/,
    use: [
  env.development && {
    loader: 'babel-loader',
    options: { plugins: ['react-refresh/babel'] }
  },
  {
    loader: 'ts-loader',
    options: {
      transpileOnly: true,
      compilerOptions: {
        module: 'esnext',
        strictNullChecks: false
      }
    }
  }
].filter(Boolean)
}

https://www.npmjs.com/package/tsconfig-paths-webpack-plugin

npm

npm: tsconfig-paths-webpack-plugin

Load modules according to tsconfig paths in webpack.

источник

18:30пожаловаться #1

The Fallen Phoenix in Webpack — русскоговорящее сообщество

Нужно указать на отдельный конфиг этой штукой.

источник

18:31пожаловаться #2

The Fallen Phoenix in Webpack — русскоговорящее сообщество

"There are two types of options: TypeScript options (aka "compiler options") and loader options. TypeScript options should be set using a tsconfig.json file. Loader options can be specified through the options property in the webpack configuration:"

источник

18:32пожаловаться #3

The Fallen Phoenix in Webpack — русскоговорящее сообщество

К слову, есть опция

{ loader: 'ts-loader', options: { transpileOnly: true } }

источник

18:32пожаловаться #4

2021 January 20

S S in Webpack — русскоговорящее сообщество

Привет всем, webpack 5 стал стабильнее?

источник

08:45пожаловаться #5

Илья in Webpack — русскоговорящее сообщество

Доброе утро! Подскажите, пожалуйста, имеется index.pug файл с тэгом и переменной name:

ul #{name}

В index.js файле прописано:

import pug from 'pug';

const compiledFunction = pug.compileFile('index.pug');
compiledFunction({ name: 'Hello' });

Хочу, чтобы отправленный в compiledFunction аргумент был отрендерен через страницу index.pug.
Но Webpack 5.15 выдает кучу ошибок в терминале наподобие:

ERROR in ./node_modules/jstransformer/index.js 3:9-22
Module not found: Error: Can't resolve 'fs' in '/mnt/c/projectpath/node_modules/jstransformer'
 @ ./node_modules/pug-filters/lib/run-filter.js 3:20-44
 @ ./node_modules/pug-filters/index.js 3:0-47
 @ ./node_modules/pug/lib/index.js 19:14-36
 @ ./src/index.js 4:0-22 8:23-38

В консоли браузера:

Uncaught Error: Cannot find module 'path'

Конфигурация Webpack самая обычная:

      {
        test: /\.pug$/, loader: 'pug-loader', options: { pretty: true },
      },

Как исправить проблему?

источник

09:13пожаловаться #6

Илья in Webpack — русскоговорящее сообщество

Подскажите еще, пожалуйста, как использовать синтаксис модулей ES6: 'import 'file' from 'file'?

источник

12:44пожаловаться #7

Oleg Dosov in Webpack — русскоговорящее сообщество

Илья

Подскажите еще, пожалуйста, как использовать синтаксис модулей ES6: 'import 'file' from 'file'?

Тебе дока по модулям в ES6 нужна или что?

источник

13:42пожаловаться #8

Oleg Dosov in Webpack — русскоговорящее сообщество

На всякий напишу, если просто тебе нужно посмотреть как импортить модули в ES6. То вот примеры:
import _ from "lodash/core";
import { compose } from "redux";
Дока по иморту https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Statements/import

Веб-документация MDN

import

Инструкция import используется для импорта ссылок на значения, экспортированные из внешнего модуля.

источник

13:46пожаловаться #9

Илья in Webpack — русскоговорящее сообщество

Oleg Dosov

Веб-документация MDN

import

Инструкция import используется для импорта ссылок на значения, экспортированные из внешнего модуля.

Если я пропишу импорт из ES6 в файле конфига вебпака - он сыпет ошибки:

[webpack-cli] Failed to load '/mnt/c/../webpack.config.js'
[webpack-cli] TypeError: Invalid host defined options

Прописка в package.json "type": "module" не помогает. В доках вебпака не вижу, чтобы юзалась модули ES6 в config файле.

источник

13:54пожаловаться #10

Нуржан in Webpack — русскоговорящее сообщество

Переслано от Нуржан

ребят подскажите пж как решить проблему в json файл в скриптах написал: "serve":"webpack-dev-server --mode development --open",
"build":"webpack --mode production" билд работает ,а серв выдает ошибку

источник

14:51пожаловаться #11

Нуржан in Webpack — русскоговорящее сообщество

Переслано от Нуржан

источник

14:51пожаловаться #12

Нуржан in Webpack — русскоговорящее сообщество

Переслано от Нуржан

источник

14:51пожаловаться #13

Roman Usherenko in Webpack — русскоговорящее сообщество

Нуржан

Переслано от Нуржан

поищи эту ошибку тут в чате

источник

15:02пожаловаться #14

Нуржан in Webpack — русскоговорящее сообщество

Переслано от Нуржан

всем большое спасибо нужно было в json файле заменить: webpack-dev-server на webpack serve

источник

15:10пожаловаться #15

ДМ

Данил Мальков... in Webpack — русскоговорящее сообщество

Нуржан

Переслано от Нуржан

всем большое спасибо нужно было в json файле заменить: webpack-dev-server на webpack serve

Спасибо

источник

15:31пожаловаться #16

ДМ

Данил Мальков... in Webpack — русскоговорящее сообщество

Нуржан

Переслано от Нуржан

всем большое спасибо нужно было в json файле заменить: webpack-dev-server на webpack serve

Вот только, при запуске вроде бы должен работать ещё и livereload, как у gulp. У меня его почему то нету, хотя при изменении и перезагрузке браузера вручную изменения происходят

источник

15:34пожаловаться #17

Нуржан in Webpack — русскоговорящее сообщество

Данил Мальков

Спасибо

у вас такая же была проблема?

источник

15:42пожаловаться #18

ДМ

Данил Мальков... in Webpack — русскоговорящее сообщество

Да)

источник