You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 7-8.RSVP
Socket
Socket
Sign inDemoInstall

laravel-elixir-webpack-official

Package Overview
Dependencies
Maintainers
1
Versions
10
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

laravel-elixir-webpack-official

Laravel Elixir Webpack integration


Version published
Weekly downloads
618
increased by25.1%
Maintainers
1
Created
Weekly downloads
 

Readme

Source

Laravel Elixir Webpack Integration

This extension brings Webpack support to Laravel Elixir, version 6 and up.

Step 1: Install

npm install laravel-elixir-webpack-official --save-dev

Step 2: Usage

Similar to Browserify, the webpack method may be used to compile and bundle ECMAScript 2015 into plain JavaScript. This function accepts a file, relative to the resources/assets/js directory, and generates a single bundled file in the public/js directory:

elixir(function(mix) {
    mix.webpack('app.js');
});

To choose a different output or base directory, simply specify your desired paths as the second and third arguments, respectively.

elixir(function(mix) {
    mix.webpack('app.js', 'public/dist', 'app/assets/js');
});

This will compile app/assets/js/app.js to public/dist/app.js.

If you'd like to leverage more of Webpack's functionality, Elixir will read any webpack.config.js file in your project root, and factor its configuration into the build process. Alternatively, you may pass your Webpack-specific configuration as the fourth argument to mix.webpack().

Step 3: Plugins

If you've created a plugin, and need to hook your own Webpack config into Elixir's defaults, add the following to your script:

Elixir.webpack.mergeConfig({
    babel: {
        presets: ['es2015'],
        plugins: ['transform-runtime'],
    },
    module: {
        loaders: [{
            test: /\.vue$/,
            loader: 'vue'
        }]
    }
});

Elixir.webpack.mergeConfig(newConfig) will recursively merge your provided configuration with ours. It also properly merges any nested arrays, so as not to override important default configuration. For example, in the code snippet above, the addition of the Vue loader will not overwrite the default loaders that we provide.

Keywords

FAQs

Package last updated on 01 Dec 2016

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc