Not supporting `import`

[TheLarkInn]

I became aware from https://github.com/webpack/webpack/issues/2710#issuecomment-229114264 that this loader doesn't support import statements. Do you think it would be possible to either:

• support import's

OR

• document that import statements aren't supported so developers don't run into unexpected behavior

Thank you for your work on this loader!!!!

[chemzqm]

I've got the same issue:

Module build failed: Error: Parse Error: Line 1: Illegal import declaration
    at throwError (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:2823:21)
    at throwErrorTolerant (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:2835:24)
    at parseSourceElement (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:6435:17)
    at parseProgramElement (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:6491:16)
    at parseProgramElements (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:6523:29)
    at parseProgram (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:6536:16)
    at Object.parse (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/node_modules/esprima-fb/esprima.js:7713:23)
    at getAstForSource (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/src/jstransform.js:244:21)
    at Object.transform (/Users/chemzqm/work/jiangwoo_web/client/node_modules/jstransform/src/jstransform.js:267:11)
    at transform (/Users/chemzqm/work/jiangwoo_web/client/node_modules/es3ify/index.js:108:24)
    at Object.module.exports (/Users/chemzqm/work/jiangwoo_web/client/node_modules/es3ify-loader/index.js:5:10)
 @ multi manage

I've looked at the code of es3ify and jstransform, jstransform could support import by es6 option, es3ify support passing options but none option would be passed down to jstransform. es3ify should be fixed for this.

[stevenjob]

I also got this issue

[chemzqm]

@stevenjob postLoaders could be used to avoid this issue

    postLoaders: [
      { test: /\.js$/, loader: 'es3ify' }
    ]

[mehrdad-shokri]

Can you give a reason why this is happening?

[CheolMinBae]

@chemzqm answer is only useful in webpack 1, in webpack 2 must use enforce: "post" option

module : { rules: { { enforce: "post", test: /.js$/, loader: 'es3ify' } } }

[ggxxyy]

[email protected] import(...) use es3ify-webpack-plugin

[yanghealsci]

@chemzqm I've got the same issue and I tried postloader witch did not work. This is my webpack config.

module: {
    rules: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        use: [{
          loader: 'babel-loader',
          options: {
            presets: [['env', {modules: false}], 'react'],
            plugins: ['syntax-dynamic-import', ['import', { libraryName: 'antd', style: true }]]
            // plugins: ['syntax-dynamic-import']
          }
        }]
      }, {
        test: /\.js?$/,
        loader: 'es3ify-loader',
        enforce: 'post'
      }
]}

[nonjene]

@chemzqm although use postLoaders , this loader still has the problem when handling es6 syntax inside node_modules.
add mainFields and ignore module can fix this.

resolve: {
    mainFields: ['browser',  'main']
}

[yf-hk]

Guys, does it support webpack 4?

[wenchma]

For webpack 4, throws too many errors:

Module build failed (from ./node_modules/es3ify-loader/index.js):
Error: Parse Error: Line 7: Illegal import declaration
...

[nonjene]

For webpack 4, throws too many errors:

Module build failed (from ./node_modules/es3ify-loader/index.js):
Error: Parse Error: Line 7: Illegal import declaration
...

add mainFields: ['browser', 'main'] can fix this error

[p6l-richard]

For webpack 4, throws too many errors:

Module build failed (from ./node_modules/es3ify-loader/index.js):
Error: Parse Error: Line 7: Illegal import declaration
...

add mainFields: ['browser', 'main'] can fix this error

Unfortunately does not work for me. Error:

ERROR in ./node_modules/dataframe-js/lib/index.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
SyntaxError: <project-root>\node_modules\dataframe-js\lib\index.js: Unexpected token, expected "," (1:8)

dataframe-js\lib\index.js - Line 1: "use strict";

webpack.config.js:

var path = require('path');
const CopyPlugin = require('copy-webpack-plugin');
// var es3ifyPlugin = require('es3ify-webpack-plugin');

module.exports = {
  mode: 'development',
  entry:{
      lib:'./src/lib.js'
  },
  output: 
  {
    filename: '[name].bundle.js',
    path: path.resolve(__dirname, 'dist'),
    libraryTarget: 'var',
    library: 'AppLib'
  },
  module:
  {
  rules: [
        {
          test: /\.js$/,
          exclude: /(node_modules|bower_components)/,
          use: {
            loader: 'babel-loader',
            options: {
              presets: [
                [
                  '@babel/preset-env',
                  {
                    useBuiltIns: 'usage'                  
                  }
                ]
              ]
            }
          }
        },
          {
            test: /\.js$/,
            include: /node_modules/,
            use: [
              {
                loader: 'babel-loader',
                options: {
                  presets: [
                    [
                      '@babel/preset-env',
                      {
                        useBuiltIns: 'usage'                  
                      }
                    ]
                  ]
                }
              },
              {
                loader: 'es3ify'
              }
            ]
              
          }
        
      ] 
  },
  plugins: [
    new CopyPlugin([
        path.resolve(__dirname + '/src/index.js'),
        'appsscript.json',
        '.clasp.json'
      ])
      // ,
      // new es3ifyPlugin()
  ],
  resolve: {
    mainFields: ['browser',  'main']
}

};