aboutsummaryrefslogtreecommitdiffhomepage
path: root/app/config/webpack
diff options
context:
space:
mode:
authorThomas Citharel <tcit@tcit.fr>2017-03-31 20:21:41 +0200
committerThomas Citharel <tcit@tcit.fr>2017-05-04 14:49:44 +0200
commit64f81bc31699ed239e4becec1cfa7ebc0bef2b5a (patch)
tree6363a596055683587d11aaffcf30608a682988aa /app/config/webpack
parent3b4502e0e663866e7bac00164fd935fdc92309d6 (diff)
downloadwallabag-64f81bc31699ed239e4becec1cfa7ebc0bef2b5a.tar.gz
wallabag-64f81bc31699ed239e4becec1cfa7ebc0bef2b5a.tar.zst
wallabag-64f81bc31699ed239e4becec1cfa7ebc0bef2b5a.zip
Adds Webpack support and removes the use for Grunt
Signed-off-by: Thomas Citharel <tcit@tcit.fr> use scss Signed-off-by: Thomas Citharel <tcit@tcit.fr> fix build, add babel, fix annotations fixes (and improvements !) for baggy add live reload & environments & eslint & theme fixes
Diffstat (limited to 'app/config/webpack')
-rw-r--r--app/config/webpack/common.js40
-rw-r--r--app/config/webpack/dev.js62
-rw-r--r--app/config/webpack/prod.js99
3 files changed, 201 insertions, 0 deletions
diff --git a/app/config/webpack/common.js b/app/config/webpack/common.js
new file mode 100644
index 00000000..4f5739f0
--- /dev/null
+++ b/app/config/webpack/common.js
@@ -0,0 +1,40 @@
1const path = require('path');
2const webpack = require('webpack');
3const StyleLintPlugin = require('stylelint-webpack-plugin');
4
5const rootDir = path.resolve(__dirname, '../../../');
6
7module.exports = function() {
8 return {
9 entry: {
10 material: path.join(rootDir, './app/Resources/static/themes/material/index.js'),
11 baggy: path.join(rootDir, './app/Resources/static/themes/baggy/index.js'),
12 },
13
14 output: {
15 filename: '[name].js',
16 path: path.resolve(rootDir, 'web/bundles/wallabagcore'),
17 publicPath: '/bundles/wallabagcore/',
18 },
19 plugins: [
20 new webpack.ProvidePlugin({
21 $: 'jquery',
22 jQuery: 'jquery',
23 'window.$': 'jquery',
24 'window.jQuery': 'jquery'
25 }),
26 new StyleLintPlugin({
27 configFile: '.stylelintrc',
28 failOnError: false,
29 quiet: false,
30 context: 'app/Resources/static/themes',
31 files: '**/*.scss',
32 }),
33 ],
34 resolve: {
35 alias: {
36 jquery: path.join(rootDir, 'node_modules/jquery/dist/jquery.js')
37 }
38 },
39 };
40};
diff --git a/app/config/webpack/dev.js b/app/config/webpack/dev.js
new file mode 100644
index 00000000..771df65b
--- /dev/null
+++ b/app/config/webpack/dev.js
@@ -0,0 +1,62 @@
1const webpackMerge = require('webpack-merge');
2const webpack = require('webpack');
3const path = require('path');
4const commonConfig = require('./common.js');
5
6module.exports = function () {
7 return webpackMerge(commonConfig(), {
8 devtool: 'eval-source-map',
9 output: {
10 filename: '[name].dev.js'
11 },
12
13 devServer: {
14 hot: true,
15 // enable HMR on the server
16
17 contentBase: './web',
18 // match the output path
19 },
20 plugins: [
21 new webpack.HotModuleReplacementPlugin(),
22 ],
23 module: {
24 rules: [
25 {
26 enforce: 'pre',
27 test: /\.js$/,
28 loader: 'eslint-loader',
29 exclude: /node_modules/,
30 },
31 {
32 test: /\.js$/,
33 exclude: /(node_modules)/,
34 use: {
35 loader: 'babel-loader',
36 options: {
37 presets: ['env']
38 }
39 }
40 },
41 {
42 test: /\.(s)?css$/,
43 use: [
44 'style-loader',
45 {
46 loader: 'css-loader',
47 options: {
48 importLoaders: 1,
49 }
50 },
51 'postcss-loader',
52 'sass-loader'
53 ]
54 },
55 {
56 test: /\.(jpg|png|gif|svg|eot|ttf|woff|woff2)$/,
57 use: 'url-loader'
58 },
59 ]
60 },
61 })
62};
diff --git a/app/config/webpack/prod.js b/app/config/webpack/prod.js
new file mode 100644
index 00000000..ef41ab99
--- /dev/null
+++ b/app/config/webpack/prod.js
@@ -0,0 +1,99 @@
1const webpack = require('webpack');
2const webpackMerge = require('webpack-merge');
3const ExtractTextPlugin = require('extract-text-webpack-plugin');
4const ManifestPlugin = require('webpack-manifest-plugin');
5
6const commonConfig = require('./common.js');
7
8module.exports = function() {
9 return webpackMerge(commonConfig(), {
10 output: {
11 filename: '[name].js'
12 },
13 devtool: 'source-map',
14 plugins: [
15 new webpack.DefinePlugin({
16 'process.env': {
17 'NODE_ENV': JSON.stringify('production')
18 }
19 }),
20 new webpack.optimize.UglifyJsPlugin({
21 beautify: false,
22 mangle: {
23 screw_ie8: true,
24 keep_fnames: true
25 },
26 compress: {
27 screw_ie8: true,
28 warnings: false
29 },
30 comments: false
31 }),
32 new ExtractTextPlugin('[name].css'),
33 new ManifestPlugin({
34 fileName: 'manifest.json',
35 })
36 ],
37 module: {
38 rules: [
39 {
40 enforce: 'pre',
41 test: /\.js$/,
42 loader: 'eslint-loader',
43 exclude: /node_modules/,
44 },
45 {
46 test: /\.js$/,
47 exclude: /(node_modules)/,
48 use: {
49 loader: 'babel-loader',
50 options: {
51 presets: ['env']
52 }
53 }
54 },
55 {
56 test: /\.(s)?css$/,
57 use: ExtractTextPlugin.extract({
58 fallback: 'style-loader',
59 use: [
60 {
61 loader: 'css-loader',
62 options: {
63 importLoaders: 1,
64 minimize: {
65 discardComments: {
66 removeAll: true
67 },
68 core: true,
69 minifyFontValues: true
70 }
71 }
72 },
73 'postcss-loader',
74 'sass-loader'
75 ]
76 })
77 },
78 {
79 test: /\.(jpg|png|gif|svg)$/,
80 use: {
81 loader: 'file-loader',
82 options: {
83 name: 'img/[name].[ext]',
84 }
85 }
86 },
87 {
88 test: /\.(eot|ttf|woff|woff2)$/,
89 use: {
90 loader: 'file-loader',
91 options: {
92 name: 'fonts/[name].[ext]',
93 }
94 }
95 }
96 ]
97 },
98 })
99};