Webpack.config.coffee in Phoenix 1.4

Phoenix Forum Questions / Help
,
1

Posting this here incase anyone is wondering how to do it.

Webpack supports several languages for the config file: https://webpack.js.org/configuration/configuration-languages/

My experience (Webpack 4.4.0) is that you don’t need to install interpreter like the docs say. Just

npm install coffeescript

And it works fine when yourename Webpack.config.js to Webpack.config.coffee

Note coffee-script was renamed to coffeescript

path = require('path')
glob = require('glob')
MiniCssExtractPlugin = require('mini-css-extract-plugin')
UglifyJsPlugin = require('uglifyjs-webpack-plugin')
OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin')
CopyWebpackPlugin = require('copy-webpack-plugin')

config =
  optimization:
    minimizer: [
      new UglifyJsPlugin({ cache: true, parallel: true, sourceMap: false })
      new OptimizeCSSAssetsPlugin({})
    ]
  entry: './js/app.js': ['./js/app.js'].concat(glob.sync('./vendor/**/*.js'))
  output:
    filename: 'app.js'
    path: path.resolve(__dirname, '../priv/static/js')
  module: rules: [ {
    test: /\.js$/
    exclude: /node_modules/
    use: 'babel-loader'
  }, {
    test: /\.sass$/
    use: [MiniCssExtractPlugin.loader, 'css-loader']
  } ]
  plugins: [
    new MiniCssExtractPlugin({ filename: '../css/app.css' }),
    new CopyWebpackPlugin([{ from: 'static/', to: '../' }])
  ]

module.exports = config
2 Likes