For users who have encountered a similar problem, there are steps that I’ve done to get it working, I’m not sure that this equilibrium way.
npm install file-loader --save
- add
import 'leaflet/dist/leaflet.css';
in main app.js - change webpack.config.js by following way:
add css-loader
to get rid of SyntaxError: Unexpected token .
and next add file-loader
and match files to get rid of Uncaught Error: Cannot find module "./images/layers.png"
:
module.exports = {
entry: "./web/static/js/app.js",
output: {
path: "./priv/static/js",
filename: "app.js"
},
module: {
loaders: [{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel'
}, {
test: /\.scss$/,
loader: ExtractTextPlugin.extract(
'style',
'css' + '!sass?outputStyle=expanded&' + stylePathResolves
)
}, {
test: /\.css$/,
loader: "style-loader!css-loader"
}, {
test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$/,
loader: 'file-loader'
}]
},
plugins: [new ExtractTextPlugin("app.css")]
};
At the beginning I got this config from some example and it’s not 100% clear why I’ve used ExtractTextPlugin
to load scss and what the correlation is with css-loader, maybe to be more coherent should I use ExtractTextPlugin also in this part, maybe someone knows and can code review? But my solution is working and I can work further.