реализация сотрясения дерева в веб-пакете 2, вызывающая ошибку

Недавно я провел рефакторинг своего приложения для работы с webpack v2. После запуска webpack -p я заметил, что размер моей сборки фактически увеличился примерно на 32 КБ. Я предполагаю, что это не реализовывало встряхивание дерева. Таким образом, в моем файле .babelrc я изменил этот код:

  "presets": [
    "react",
    "es2015",
    "stage-0",
  ]

в ==>

  "presets": [
    ["es2015", { "modules": false }],
    "react",
     "stage-0",
  ]

Но теперь я получаю следующую ошибку:

> webpack -p

C:\Users\jasan\Downloads\app\webpack.config.babel.js:1
(function (exports, require, module, __filename, __dirname) { import webpack fro
m 'webpack';
                                                              ^^^^^^
SyntaxError: Unexpected token import
    at Object.exports.runInThisContext (vm.js:76:16)
    at Module._compile (module.js:542:28)
    at loader (C:\Users\jasan\Downloads\app\node_modules\babel-register\lib\n
ode.js:144:5)
    at Object.require.extensions.(anonymous function) [as .js] (C:\Users\jasan\D
ownloads\app\node_modules\babel-register\lib\node.js:154:7)
    at Module.load (module.js:487:32)
    at tryModuleLoad (module.js:446:12)
    at Function.Module._load (module.js:438:3)
    at Module.require (module.js:497:17)
    at require (internal/module.js:20:19)
    at requireConfig (C:\Users\jasan\Downloads\app\node_modules\webpack\bin\c
onvert-argv.js:96:18)

webpack reactjs babeljs native-module webpack-2
person jasan    schedule 13.02.2017    source источник
comment
у вас установлены babel-register и babel-core?   -  person uladzimir    schedule 13.02.2017
comment
также встряхивание дерева работает, только если вы включите uglifyjs   -  person uladzimir    schedule 13.02.2017
comment
Установлены babel-register и babel-core. Реализован плагин Uglifyjs.   -  person jasan    schedule 13.02.2017
comment
вы пробовали с этой командой node -r babel-register node_modules/.bin/webpack -p?   -  person uladzimir    schedule 13.02.2017
comment
Я только что сделал, и в результате получилось: C:\Users\jasan\Downloads\app\node_modules\.bin\webpack:2 baseir=$(dirname $(echo $0 | sed -e 's,\\,/,g') ) ^^^^^^^ SyntaxError: отсутствует ) после списка аргументов в Object.exports.runInThisContext (vm.js:76:16) в Module._compile (module.js:542:28) в Module._extensions..js (module.js:579:10) в Object.require.extensions.(анонимная функция) [как .js]   -  person jasan    schedule 13.02.2017

Ответы (2)


arrow_upward
1
arrow_downward

Проблема в том, что когда webpack видит webpack.config.babel.js, он пытается использовать .babelrc с предустановленными es2015 и "modules": false, это означает, что он оставляет import/export операторы как есть. Но node.js не может понять такой синтаксис, поэтому вы должны предоставить модули CommonJS для node.

Одно из возможных решений — перенести конфигурацию из .babelrc в webpack-loader напрямую с параметром query.

module: {
  loaders: [
    { test: /\.js$/, 
      exclude: /node_modules/, 
      loader: "babel-loader", 
      query: {
        "presets": [
          "react",
          ["es2015", { "modules": false }],
          "stage-0"
         ]
      }    
    }
  ]
}

а в .babelrc оставить только плагин для преобразования импорта в CommonJS:

{
  "plugins": ["transform-es2015-modules-commonjs"]
}

Не забудьте добавить нужный плагин в package.json

"babel-plugin-transform-es2015-modules-commonjs": "^6.22.0"

Для получения дополнительной информации, пожалуйста, проверьте эту проблему, а также https://github.com/webpack/webpack/issues/1403

person uladzimir    schedule 13.02.2017
comment
ну, это изменение принесло новую ошибку: ERROR in ./app/index.js Module build failed: SyntaxError: C:/Users/jasan/Downloads/app/app/index.js: Unexpected token (28:18) 26 | 27 | const manifest = { > 28 | 1: (state) => ({...state, staleReducer: undefined}), | ^ 29 | 2: (state) => ({...state, app: {...state.app, staleKey: undefined}}) - person jasan; 13.02.2017
comment
@jasan у вас есть jsx в строке test для babel-loader? - person uladzimir; 13.02.2017
comment
@jasan это должно просто работать, потому что оператор распространения поддерживается с этапа 3 babeljs.io /docs/plugins/preset-stage-3 - person uladzimir; 13.02.2017
comment
нет, на самом деле у меня просто есть js в тесте, я только что попробовал (js | jsx), но та же ошибка - person jasan; 13.02.2017
comment
не могли бы вы поделиться примером кода, который выдает ошибку? - person uladzimir; 13.02.2017
comment
скорее всего вам нужно поиграться с порядком пресетов, это может быть `[es2015, {modules: false}], react, stage-0]` - person uladzimir; 13.02.2017
comment
Я не уверен, что вызывает точную ошибку, будет ли достаточно конфигурации веб-пакета? - person jasan; 13.02.2017
comment
вот мой список настроек веб-пакета: gist.github.com/jasan-s/6f3eb3c86c9b76beff823bbcc3046db8 - person jasan; 13.02.2017
comment
ну, я не уверен, в чем здесь может быть проблема, может быть, проблема в LoaderOptionsPlugin. Вы пытались изменить ключ с babel-loader на babel? - person uladzimir; 13.02.2017
comment
в любом случае похоже, что это другая проблема. лучше задать новый вопрос с конкретной проблемой - person uladzimir; 13.02.2017

arrow_upward
0
arrow_downward

в webpack.config.js

используйте 1_

вместо

import webpack from 'webpack';

person gray.songs.Benson    schedule 09.05.2017