sairion / buble-loader Goto Github PK

Webpack loader that compiles ES2015 features using buble

JavaScript 100.00%

buble-loader's Introduction

buble-loader

This package allows you to transpile ES2015 source using buble. See Buble project website to check out supported features.

Installation

npm i -S buble-loader buble

Usage

Add something like this to your webpack.config.js

module: {
  rules: [
    {
      test: /\.js$/,
      loader: 'buble-loader',
      include: path.join(__dirname, 'src'),
      options: {
        objectAssign: 'Object.assign'
      }
    }
  ]
}

buble-loader's People

Contributors

Stargazers

Watchers

Forkers

yyx990803 queckezz akkuma kidkarolis monfera srph nicko amilajack kunamatata simon04 mhoyer lukehedger marcushultman alanclarke

buble-loader's Issues

Report errors from buble

When compiling in webpack I get:

ERROR in ./app/createRoot.js
Module build failed: Error
    at JSXOpeningElement.transpile (/Users/karolis/Documents/workspace/overview-ui/node_modules/buble/dist/buble.umd.js:2642:15)
    at JSXElement.transpile (/Users/karolis/Documents/workspace/overview-ui/node_modules/buble/dist/buble.umd.js:880:12)
    at JSXElement.transpile (/Users/karolis/Documents/workspace/overview-ui/node_modules/buble/dist/buble.umd.js:2528:30)
    at ReturnStatement.transpile (/Users/karolis/Documents/workspace/overview-ui/node_modules/buble/dist/buble.umd.js:6126:20)

When compiling directly with buble, I get a more detailed error:


---
8  : export default function createRoot (shell, data) {
9  :   const { initialProperty } = data
10 :   const store = createStore()
11 :   const Root = (props) => {
12 :     return <Overview {...props} shell={shell} />
                ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
Mixed JSX attributes ending in spread requires specified objectAssign option with 'Object.assign' or polyfill helper. (12:11)

Would be great to pass these nice errors to webpack somehow.

Still accepting PRs?

buble-loader has gotten pretty far behind buble, especially the browser targets and their supported features. Is @sairion still accepting PRs?

Issue with latest webpack and buble

The latest Webpack 2.2.0-rc.2 with the latest vue, buble and buble-loader doesn't work. It might be Buble or the loader. Now I must use the commented out code.

Hash: aea9930c9ec965ef369c
Version: webpack 2.2.0-rc.2
Time: 22ms

ERROR in ../app/webpack/modules/debug-tool/store/mutations.js
Module parse failed: /opt/webird/dev/node_modules/buble-loader/index.js?{"objectAssign":"Object.assign","transforms":{"modules":false,"forOf":false}}!/opt/webird/app/webpack/modules/debug-tool/store/mutations.js Unexpected token (23:0)
You may need an appropriate loader to handle this file type.
| 
| export default ( obj = {}
| var obj;, obj[types.SET_OPEN_FLAG] = function (state, payload) {
|     state.isOpen = payload
|   }, obj )
 @ ../app/webpack/modules/debug-tool/store/index.js 6:0-35
 @ ../app/webpack/modules/debug-tool/index.js
 @ ../app/webpack/commons/vue/index.js

// System
import Vue from 'vue'
// Local
import * as types from './mutation-types'

// const mutations = {
//
//   /**
//    *
//    */
//   [types.SET_OPEN_FLAG] (state, payload) {
//     state.isOpen = payload
//     if (state.isOpen) {
//       state.wasOpened = true
//     }
//   },
//
// }
// export default mutations


export default {

  /**
   *
   */
  [types.SET_OPEN_FLAG] (state, payload) {
    state.isOpen = payload
  },

}

source-map

I did not find a simple way to have buble-loader also let buble create source maps. is there an easy way I am missing ?

Hey, would you be open to me converting this repo to standard linting. It would make it easier to contribute as right now there's no linter setup in the project. Standard is great and 0 setup (just like bublè!).

Allow passing options to buble

I need to pass additional options to buble.transform. I patched the buble-loader code like this to make it work:

    var transformed = buble.transform(source, {
        transforms: {
            modules: false
-       }
+       },
+           objectAssign: 'angular.extend'
    });

It would be great if I could somehow pass additional options through the webpack configuration to the buble-loader which are then added like shown above!

Can't get object-assign package to work with buble-loader

Hello,

I'm using webpack 2 with buble and buble loader. I have this code inside my rules array :

{
	test: /.js$/,
	loaders: 'buble-loader',
	include: path.join(__dirname, 'client'),
	query: {
		objectAssign: 'object-assign'
	}
}

Unfortunetly, it seems like the polyfill just isn't working. I need to polyfill Object.assign for IE 11.
The error I'm getting on whichever browser is the following Uncaught ReferenceError: object is not defined

Unable to get Object.assign working with `vue-loader` and Webpack 2

vuejs/vue-loader#389

How can buble-loader work with configured options when there is a stage of indirection like when using vue-loader?

vue-loader also has issues working with Babel unless the .babelrc file is used so this issue is not unique to buble-loader. I tried using a LoaderOptionsPlugin to pass in the objectAssign value but it doesn't work.

Issues with webpack v2.2.1

With the default config in the README:

➜  buble-nodent-webpack ./node_modules/.bin/webpack
/Users/josh/Scratch/buble-nodent-webpack/node_modules/loader-runner/lib/loadLoader.js:35
			throw new Error("Module '" + loader.path + "' is not a loader (must have normal or pitch function)");
			^

Error: Module '/Users/josh/Scratch/buble-nodent-webpack/node_modules/buble/dist/buble.umd.js' is not a loader (must have normal or pitch function)
    at loadLoader (/Users/josh/Scratch/buble-nodent-webpack/node_modules/loader-runner/lib/loadLoader.js:35:10)
    at iteratePitchingLoaders (/Users/josh/Scratch/buble-nodent-webpack/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
    at runLoaders (/Users/josh/Scratch/buble-nodent-webpack/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
    at NormalModule.doBuild (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/NormalModule.js:129:2)
    at NormalModule.build (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/NormalModule.js:180:15)
    at Compilation.buildModule (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/Compilation.js:142:10)
    at moduleFactory.create (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/Compilation.js:424:9)
    at /Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/NormalModuleFactory.js:242:4
    at /Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/NormalModuleFactory.js:93:13
    at /Users/josh/Scratch/buble-nodent-webpack/node_modules/tapable/lib/Tapable.js:204:11
    at NormalModuleFactory.params.normalModuleFactory.plugin (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/CompatibilityPlugin.js:52:5)
    at NormalModuleFactory.applyPluginsAsyncWaterfall (/Users/josh/Scratch/buble-nodent-webpack/node_modules/tapable/lib/Tapable.js:208:13)
    at onDoneResolving (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/NormalModuleFactory.js:68:11)
    at onDoneResolving (/Users/josh/Scratch/buble-nodent-webpack/node_modules/webpack/lib/NormalModuleFactory.js:189:6)
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickCallback (internal/process/next_tick.js:98:9)

➜  buble-nodent-webpack ./node_modules/.bin/webpack --version
2.2.1

Any ideas?

TypeError: Cannot read property \'transforms\' of null\n at Object.module.exports

I am not sure if this is a bug on this project or related to laravel-mix or other, I gonna post here the issue, because I am lost finding how to resolve the problem:

# gulp default
[11:33:13] Using gulpfile /var/www/web/gulpfile.js
[11:33:13] Starting 'all'...
[11:33:13] Starting 'less'...
[11:33:25] Finished 'less' after 12 s
[11:33:25] Starting 'copy'...
[11:33:25] Finished 'copy' after 47 ms
[11:33:25] Starting 'copy'...
[11:33:25] Finished 'copy' after 145 ms
[11:33:25] Starting 'webpack'...
{ [Error: ./resources/assets/js/app.js
Module build failed: TypeError: Cannot read property 'transforms' of null
    at Object.module.exports (/var/www/web/node_modules/buble-loader/index.js:18:46)]
  message: './resources/assets/js/app.js\nModule build failed: TypeError: Cannot read property \'transforms\' of null\n    at Object.module.exports (/var/www/web/node_modules/buble-loader/index.js:18:46)',
  showStack: false,
  showProperties: true,
  plugin: 'webpack-stream',
  __safety: { toString: [Function: bound ] } }

As far I could see, I have this versions:

./node_modules/laravel-elixir-webpack-official/package.json:34: "buble-loader": "^0.2.2",

./package.json:16: "buble-loader": "^0.5.0",

peerinvalid Peer [email protected] wants [email protected]

Environment:
OS: Ubuntu 14.04 LTS
node - v0.10.25
npm - v1.3.10

Working on a laravel project and getting following error when installing npm.

I tried doing npm install buble@^0.7.0 but it did not solve the issue.

Drop out peerDependencies

PeerDependencies can't be resolved well automatically. And your last update broke our build.

Move buble to dependencies to not break builds when upgrade
Remove webpack because this package is not dependent to webpack at all. Users can decide how to use it.

Remove support for Webpack 1

Buble doesn't transpile import/export statements, making Buble impossible to work with Webpack 1. Moreover, Webpack 2 already does this.

Alternatively, we can add a warning for Webpack 1 users about this.

Getting error using buble-loader and jsx

webpack.config.js

var path = require('path');
var webpack = require('webpack');

module.exports = {
  entry: './index.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js'
  },
  module: {
    rules: [
      { test: /\.(js|jsx)$/, use: 'buble-loader' }
    ]
  }
};

index.js

import ReactDOM from 'react-dom';
import React from 'react';

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

const element = <Welcome name="Sara" />;
ReactDOM.render(
  element,
  document.getElementById('root')
);

Error message in console: React is not defined -> var element = React.createElement( Welcome, { name: "Sara" });

I did notice this note on the buble website: 'If React (or whatever other JSX library you're using) isn't available in the global namespace, you're responsible for importing it into the file:'. But even when I do, it still throws this error.

Webpack + Preact - Erro Transform Backticks ``

Hello, I am trying to learn and organize all the information in Reactive Development, I am not yet an expert on the subject, I am hoping to gather as much information as: Webpack, PWA, Service Works ..... among others, I want to be expecializar in developing applications Progressive Web Apps, I have made some advances, but still much is missing. For example I always found the bad Babel in your transpiler, very dirty the file ... So I discovered Buble, through this link -> https://nolanlawson.github.io/frontendday-2016/#1, I liked it a lot as is the result of the transpiler with Buble. Only that in my configuration is not working ... I use Webpack 3 + Preact + CSS Styled-Components (which is very good). I deleted my Babel configuration, which was working and I decided to adopt Buble. How do I set up:

1 - Webpack 3 with Buble?
2 - I tried to use this in Webpack ->
{test: /. js $ /, loaders: 'buble-loader', exclude: / node_modules /, include: Path.join (BIFAO_COMPONENTS),
query: {objectAssign: 'Object.assign'}
},
3 - As the styled-component uses `` backticks, it is giving this error:
Tagged template strings are not supported. Use transforms: {templateString: false} to skip transformation and disable this error, or `tra
nsforms: {dangerousTaggedTemplateString: true} `if you know what you're doing (45: 0)
@ multi (webpack) -dev-server / client? http: // localhost: 9000 ./bifaosteakhouse/components/app.js

4 - Like where I include in the webpack this part:
buble ({jsx: 'h'})

Update buble peerDependency version

Buble is 0.14.* now

DELETED

My account was compromised, as a result many spam issues got created across multiple repos. I am deleting all such issues. Please check my tweet: https://x.com/arghyac35/status/1729721954909684064?s=20