From bbffa9830bc7ae96d657e7aee601459aba21b790 Mon Sep 17 00:00:00 2001 From: Matteo Pagliazzi Date: Sun, 15 Jan 2017 20:49:15 +0100 Subject: [PATCH] client: replace deprecated vue-resource with axios, lint more file --- .eslintignore | 6 +- package.json | 2 +- .../e2e/custom-assertions/elementCount.js | 11 ++-- test/client/e2e/nightwatch.conf.js | 59 ++++++++++--------- test/client/e2e/runner.js | 10 ++-- test/client/e2e/specs/test.js | 5 +- test/client/unit/index.js | 6 +- test/client/unit/karma.conf.js | 19 +++--- webpack/build.js | 24 ++++---- webpack/config/dev.env.js | 4 +- webpack/config/index.js | 14 +++-- webpack/config/test.env.js | 4 +- webpack/dev-client.js | 13 ++-- webpack/dev-server.js | 44 +++++++------- webpack/utils.js | 40 +++++++------ webpack/webpack.base.conf.js | 25 ++++---- webpack/webpack.dev.conf.js | 14 ++--- webpack/webpack.prod.conf.js | 49 ++++++++------- website/client/main.js | 9 ++- website/client/store/actions/tasks.js | 6 +- website/client/store/actions/user.js | 6 +- 21 files changed, 189 insertions(+), 181 deletions(-) diff --git a/.eslintignore b/.eslintignore index 423a19b761..bf59002477 100644 --- a/.eslintignore +++ b/.eslintignore @@ -20,8 +20,4 @@ website/common/browserify.js test/content/**/* Gruntfile.js gulpfile.js -gulp -webpack -test/client/e2e -test/client/unit/index.js -test/client/unit/karma.conf.js +gulp \ No newline at end of file diff --git a/package.json b/package.json index 73182ba57d..a53f4f031c 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "async": "^1.5.0", "autoprefixer": "^6.4.0", "aws-sdk": "^2.0.25", + "axios": "^0.15.3", "babel-core": "^6.0.0", "babel-loader": "^6.0.0", "babel-plugin-syntax-async-functions": "^6.13.0", @@ -118,7 +119,6 @@ "vue": "^2.1.0", "vue-hot-reload-api": "^1.2.0", "vue-loader": "^10.0.0", - "vue-resource": "^1.0.2", "vue-router": "^2.0.0-rc.5", "vue-template-compiler": "^2.1.0", "webpack": "^1.12.2", diff --git a/test/client/e2e/custom-assertions/elementCount.js b/test/client/e2e/custom-assertions/elementCount.js index 2caa06e025..b2f5755f0f 100644 --- a/test/client/e2e/custom-assertions/elementCount.js +++ b/test/client/e2e/custom-assertions/elementCount.js @@ -7,7 +7,7 @@ // for how to write custom assertions see // http://nightwatchjs.org/guide#writing-custom-assertions exports.assertion = function (selector, count) { - this.message = 'Testing if element <' + selector + '> has count: ' + count; + this.message = `Testing if element <${selector}> has count: ${count}`; this.expected = count; this.pass = function (val) { return val === this.expected; @@ -16,11 +16,10 @@ exports.assertion = function (selector, count) { return res.value; }; this.command = function (cb) { - var self = this; - return this.api.execute(function (selector) { - return document.querySelectorAll(selector).length; - }, [selector], function (res) { - cb.call(self, res); + return this.api.execute((el) => { + return document.querySelectorAll(el).length; + }, [selector], (res) => { + cb.call(this, res); }); }; }; diff --git a/test/client/e2e/nightwatch.conf.js b/test/client/e2e/nightwatch.conf.js index 1f8eb8bd93..eb64807bcf 100644 --- a/test/client/e2e/nightwatch.conf.js +++ b/test/client/e2e/nightwatch.conf.js @@ -1,45 +1,48 @@ +/* eslint-disable camelcase */ + require('babel-register'); -var config = require('../../../webpack/config'); +const config = require('../../../webpack/config'); +const chromeDriverPath = require('chromedriver').path; // http://nightwatchjs.org/guide#settings-file module.exports = { - 'src_folders': ['test/client/e2e/specs'], - 'output_folder': 'test/client/e2e/reports', - 'custom_assertions_path': ['test/client/e2e/custom-assertions'], + src_folders: ['test/client/e2e/specs'], + output_folder: 'test/client/e2e/reports', + custom_assertions_path: ['test/client/e2e/custom-assertions'], - 'selenium': { - 'start_process': true, - 'server_path': 'node_modules/selenium-server/lib/runner/selenium-server-standalone-2.53.0.jar', - 'host': '127.0.0.1', - 'port': 4444, - 'cli_args': { - 'webdriver.chrome.driver': require('chromedriver').path, + selenium: { + start_process: true, + server_path: 'node_modules/selenium-server/lib/runner/selenium-server-standalone-2.53.0.jar', + host: '127.0.0.1', + port: 4444, + cli_args: { + 'webdriver.chrome.driver': chromeDriverPath, }, }, - 'test_settings': { - 'default': { - 'selenium_port': 4444, - 'selenium_host': 'localhost', - 'silent': true, - 'globals': { - 'devServerURL': 'http://localhost:' + (process.env.PORT || config.dev.port), + test_settings: { + default: { + selenium_port: 4444, + selenium_host: 'localhost', + silent: true, + globals: { + devServerURL: `http://localhost:${process.env.PORT || config.dev.port}`, // eslint-disable-line no-process-env }, }, - 'chrome': { - 'desiredCapabilities': { - 'browserName': 'chrome', - 'javascriptEnabled': true, - 'acceptSslCerts': true, + chrome: { + desiredCapabilities: { + browserName: 'chrome', + javascriptEnabled: true, + acceptSslCerts: true, }, }, - 'firefox': { - 'desiredCapabilities': { - 'browserName': 'firefox', - 'javascriptEnabled': true, - 'acceptSslCerts': true, + firefox: { + desiredCapabilities: { + browserName: 'firefox', + javascriptEnabled: true, + acceptSslCerts: true, }, }, }, diff --git a/test/client/e2e/runner.js b/test/client/e2e/runner.js index d4e3423c82..4c3829f785 100644 --- a/test/client/e2e/runner.js +++ b/test/client/e2e/runner.js @@ -1,6 +1,6 @@ // 1. start the dev server using production config -process.env.NODE_ENV = 'testing'; -var server = require('../../../webpack/dev-server.js'); +process.env.NODE_ENV = 'testing'; // eslint-disable-line no-process-env +const server = require('../../../webpack/dev-server.js'); // 2. run the nightwatch test suite against it // to run in additional browsers: @@ -9,7 +9,7 @@ var server = require('../../../webpack/dev-server.js'); // or override the environment flag, for example: `npm run e2e -- --env chrome,firefox` // For more information on Nightwatch's config file, see // http://nightwatchjs.org/guide#settings-file -var opts = process.argv.slice(2); +let opts = process.argv.slice(2); if (opts.indexOf('--config') === -1) { opts = opts.concat(['--config', 'test/client/e2e/nightwatch.conf.js']); } @@ -17,8 +17,8 @@ if (opts.indexOf('--env') === -1) { opts = opts.concat(['--env', 'chrome']); } -var spawn = require('cross-spawn'); -var runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' }); +const spawn = require('cross-spawn'); +const runner = spawn('./node_modules/.bin/nightwatch', opts, { stdio: 'inherit' }); runner.on('exit', function (code) { server.close(); diff --git a/test/client/e2e/specs/test.js b/test/client/e2e/specs/test.js index 7e395ec796..e3e19d4d96 100644 --- a/test/client/e2e/specs/test.js +++ b/test/client/e2e/specs/test.js @@ -2,12 +2,11 @@ // http://nightwatchjs.org/guide#usage module.exports = { - 'default e2e tests': function (browser) { - + 'default e2e tests' (browser) { // automatically uses dev Server port from /config.index.js // default: http://localhost:8080 // see nightwatch.conf.js - var devServer = browser.globals.devServerURL; + const devServer = browser.globals.devServerURL; browser .url(devServer) diff --git a/test/client/unit/index.js b/test/client/unit/index.js index a44dd9ce1c..998dca4675 100644 --- a/test/client/unit/index.js +++ b/test/client/unit/index.js @@ -1,11 +1,11 @@ -// TODO verify if it's needed, added because Vuex require Promise in the global scope +// TODO verify if it's needed, added because Axios require Promise in the global scope // and babel-runtime doesn't affect external libraries require('babel-polyfill'); // require all test files (files that ends with .spec.js) -var testsContext = require.context('./specs', true, /\.spec$/); +let testsContext = require.context('./specs', true, /\.spec$/); testsContext.keys().forEach(testsContext); // require all .vue and .js files except main.js for coverage. -var srcContext = require.context('../../../website/client', true, /^\.\/(?=(?!main(\.js)?$))(?=(.*\.(vue|js)$))/); +let srcContext = require.context('../../../website/client', true, /^\.\/(?=(?!main(\.js)?$))(?=(.*\.(vue|js)$))/); srcContext.keys().forEach(srcContext); \ No newline at end of file diff --git a/test/client/unit/karma.conf.js b/test/client/unit/karma.conf.js index 90657a9870..6ef13b4ec4 100644 --- a/test/client/unit/karma.conf.js +++ b/test/client/unit/karma.conf.js @@ -3,14 +3,15 @@ // we are also using it with karma-webpack // https://github.com/webpack/karma-webpack -var path = require('path'); -var merge = require('webpack-merge'); -var baseConfig = require('../../../webpack/webpack.base.conf'); -var utils = require('../../../webpack/utils'); -var webpack = require('webpack'); -var projectRoot = path.resolve(__dirname, '../../../'); +const path = require('path'); +const merge = require('webpack-merge'); +const baseConfig = require('../../../webpack/webpack.base.conf'); +const utils = require('../../../webpack/utils'); +const webpack = require('webpack'); +const projectRoot = path.resolve(__dirname, '../../../'); +const testEnv = require('../../../webpack/config/test.env'); -var webpackConfig = merge(baseConfig, { +const webpackConfig = merge(baseConfig, { // use inline sourcemap for karma-sourcemap-loader module: { loaders: utils.styleLoaders(), @@ -23,7 +24,7 @@ var webpackConfig = merge(baseConfig, { }, plugins: [ new webpack.DefinePlugin({ - 'process.env': require('../../../webpack/config/test.env'), + 'process.env': testEnv, }), ], }); @@ -43,7 +44,7 @@ webpackConfig.module.preLoaders.unshift({ }); // only apply babel for test files when using isparta -webpackConfig.module.loaders.some(function (loader, i) { +webpackConfig.module.loaders.some((loader) => { if (loader.loader === 'babel') { loader.include = path.resolve(projectRoot, 'test/client/unit'); return true; diff --git a/webpack/build.js b/webpack/build.js index c815ec4692..eff29011f0 100644 --- a/webpack/build.js +++ b/webpack/build.js @@ -1,35 +1,37 @@ +/* global env:true, rm:true, mkdir:true, cp:true */ + // https://github.com/shelljs/shelljs require('shelljs/global'); env.NODE_ENV = 'production'; -var path = require('path'); -var config = require('./config'); -var ora = require('ora'); -var webpack = require('webpack'); -var webpackConfig = require('./webpack.prod.conf'); +const path = require('path'); +const config = require('./config'); +const ora = require('ora'); +const webpack = require('webpack'); +const webpackConfig = require('./webpack.prod.conf'); -console.log( +console.log( // eslint-disable-line no-console ' Tip:\n' + ' Built files are meant to be served over an HTTP server.\n' + ' Opening index.html over file:// won\'t work.\n' ); -var spinner = ora('building for production...'); +const spinner = ora('building for production...'); spinner.start(); -var assetsPath = path.join(config.build.assetsRoot, config.build.assetsSubDirectory); +const assetsPath = path.join(config.build.assetsRoot, config.build.assetsSubDirectory); rm('-rf', assetsPath); mkdir('-p', assetsPath); cp('-R', config.build.staticAssetsDirectory, assetsPath); -webpack(webpackConfig, function (err, stats) { +webpack(webpackConfig, (err, stats) => { spinner.stop(); if (err) throw err; - process.stdout.write(stats.toString({ + process.stdout.write(`${stats.toString({ colors: true, modules: false, children: false, chunks: false, chunkModules: false, - }) + '\n'); + })}\n`); }); diff --git a/webpack/config/dev.env.js b/webpack/config/dev.env.js index 3198705074..6c18ee1767 100644 --- a/webpack/config/dev.env.js +++ b/webpack/config/dev.env.js @@ -1,5 +1,5 @@ -var merge = require('webpack-merge'); -var prodEnv = require('./prod.env'); +const merge = require('webpack-merge'); +const prodEnv = require('./prod.env'); module.exports = merge(prodEnv, { NODE_ENV: '"development"', diff --git a/webpack/config/index.js b/webpack/config/index.js index a6d5474490..b7a1cbf86f 100644 --- a/webpack/config/index.js +++ b/webpack/config/index.js @@ -1,15 +1,17 @@ // see http://vuejs-templates.github.io/webpack for documentation. -var path = require('path'); +const path = require('path'); +const staticAssetsDirectory = './website/static/.'; // The folder where static files (not processed) live +const prodEnv = require('./prod.env'); +const devEnv = require('./dev.env'); -var staticAssetsDirectory = './website/static/.'; // The folder where static files (not processed) live module.exports = { build: { - env: require('./prod.env'), + env: prodEnv, index: path.resolve(__dirname, '../../dist-client/index.html'), assetsRoot: path.resolve(__dirname, '../../dist-client'), assetsSubDirectory: 'static', assetsPublicPath: '/new-app', - staticAssetsDirectory: staticAssetsDirectory, + staticAssetsDirectory, productionSourceMap: true, // Gzip off by default as many popular static hosts such as // Surge or Netlify already gzip all static assets for you. @@ -19,11 +21,11 @@ module.exports = { productionGzipExtensions: ['js', 'css'], }, dev: { - env: require('./dev.env'), + env: devEnv, port: 8080, assetsSubDirectory: 'static', assetsPublicPath: '/', - staticAssetsDirectory: staticAssetsDirectory, + staticAssetsDirectory, proxyTable: { // proxy all requests starting with /api/v3 to localhost:3000 '/api/v3': { diff --git a/webpack/config/test.env.js b/webpack/config/test.env.js index fea551ca2c..88d932a8c0 100644 --- a/webpack/config/test.env.js +++ b/webpack/config/test.env.js @@ -1,5 +1,5 @@ -var merge = require('webpack-merge'); -var devEnv = require('./dev.env'); +const merge = require('webpack-merge'); +const devEnv = require('./dev.env'); module.exports = merge(devEnv, { NODE_ENV: '"testing"', diff --git a/webpack/dev-client.js b/webpack/dev-client.js index b10b0eed48..e81faee24c 100644 --- a/webpack/dev-client.js +++ b/webpack/dev-client.js @@ -1,9 +1,10 @@ -/* eslint-disable */ -require('eventsource-polyfill') -var hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true&overlay=false') +/* global window:true */ -hotClient.subscribe(function (event) { +require('eventsource-polyfill'); +const hotClient = require('webpack-hot-middleware/client?noInfo=true&reload=true&overlay=false'); + +hotClient.subscribe(event => { if (event.action === 'reload') { - window.location.reload() + window.location.reload(); } -}) +}); diff --git a/webpack/dev-server.js b/webpack/dev-server.js index a42e7fdfa6..a8b13a3131 100644 --- a/webpack/dev-server.js +++ b/webpack/dev-server.js @@ -1,22 +1,24 @@ -var path = require('path'); -var express = require('express'); -var webpack = require('webpack'); -var config = require('./config'); -var proxyMiddleware = require('http-proxy-middleware'); -var webpackConfig = process.env.NODE_ENV === 'testing' - ? require('./webpack.prod.conf') - : require('./webpack.dev.conf'); +/* eslint-disable no-process-env, no-console */ + +const path = require('path'); +const express = require('express'); +const webpack = require('webpack'); +const config = require('./config'); +const proxyMiddleware = require('http-proxy-middleware'); +const webpackConfig = process.env.NODE_ENV === 'testing' ? + require('./webpack.prod.conf') : + require('./webpack.dev.conf'); // default port where dev server listens for incoming traffic -var port = process.env.PORT || config.dev.port; +const port = process.env.PORT || config.dev.port; // Define HTTP proxies to your custom API backend // https://github.com/chimurai/http-proxy-middleware -var proxyTable = config.dev.proxyTable; +const proxyTable = config.dev.proxyTable; -var app = express(); -var compiler = webpack(webpackConfig); +const app = express(); +const compiler = webpack(webpackConfig); -var devMiddleware = require('webpack-dev-middleware')(compiler, { +const devMiddleware = require('webpack-dev-middleware')(compiler, { publicPath: webpackConfig.output.publicPath, stats: { colors: true, @@ -24,18 +26,18 @@ var devMiddleware = require('webpack-dev-middleware')(compiler, { }, }); -var hotMiddleware = require('webpack-hot-middleware')(compiler); +const hotMiddleware = require('webpack-hot-middleware')(compiler); // force page reload when html-webpack-plugin template changes -compiler.plugin('compilation', function (compilation) { - compilation.plugin('html-webpack-plugin-after-emit', function (data, cb) { +compiler.plugin('compilation', (compilation) => { + compilation.plugin('html-webpack-plugin-after-emit', (data, cb) => { hotMiddleware.publish({ action: 'reload' }); cb(); }); }); // proxy api requests -Object.keys(proxyTable).forEach(function (context) { - var options = proxyTable[context]; +Object.keys(proxyTable).forEach((context) => { + let options = proxyTable[context]; if (typeof options === 'string') { options = { target: options }; } @@ -53,13 +55,13 @@ app.use(devMiddleware); app.use(hotMiddleware); // serve pure static assets -var staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory); +const staticPath = path.posix.join(config.dev.assetsPublicPath, config.dev.assetsSubDirectory); app.use(staticPath, express.static(config.dev.staticAssetsDirectory)); -module.exports = app.listen(port, function (err) { +module.exports = app.listen(port, (err) => { if (err) { console.log(err); return; } - console.log('Listening at http://localhost:' + port + '\n'); + console.log(`Listening at http://localhost:${port}\n`); }); diff --git a/webpack/utils.js b/webpack/utils.js index 7ad8044e0d..5099ffa3c3 100644 --- a/webpack/utils.js +++ b/webpack/utils.js @@ -1,28 +1,30 @@ -var path = require('path'); -var config = require('./config'); -var ExtractTextPlugin = require('extract-text-webpack-plugin'); +/* eslint-disable no-process-env, no-console */ -exports.assetsPath = function (_path) { - var assetsSubDirectory = process.env.NODE_ENV === 'production' - ? config.build.assetsSubDirectory - : config.dev.assetsSubDirectory; +const path = require('path'); +const config = require('./config'); +const ExtractTextPlugin = require('extract-text-webpack-plugin'); + +exports.assetsPath = (_path) => { + const assetsSubDirectory = process.env.NODE_ENV === 'production' ? + config.build.assetsSubDirectory : + config.dev.assetsSubDirectory; return path.posix.join(assetsSubDirectory, _path); }; -exports.cssLoaders = function (options) { +exports.cssLoaders = (options) => { options = options || {}; // generate loader string to be used with extract text plugin function generateLoaders (loaders) { - var sourceLoader = loaders.map(function (loader) { - var extraParamChar; + let sourceLoader = loaders.map((loader) => { + let extraParamChar; if (/\?/.test(loader)) { loader = loader.replace(/\?/, '-loader?'); extraParamChar = '&'; } else { - loader = loader + '-loader'; + loader = `${loader}-loader`; extraParamChar = '?'; } - return loader + (options.sourceMap ? extraParamChar + 'sourceMap' : ''); + return `${loader}${(options.sourceMap ? extraParamChar + 'sourceMap' : '')}`; // eslint-disable-line prefer-template }).join('!'); if (options.extract) { @@ -45,14 +47,14 @@ exports.cssLoaders = function (options) { }; // Generate loaders for standalone style files (outside of .vue) -exports.styleLoaders = function (options) { - var output = []; - var loaders = exports.cssLoaders(options); - for (var extension in loaders) { - var loader = loaders[extension]; +exports.styleLoaders = (options) => { + const output = []; + const loaders = exports.cssLoaders(options); + for (let extension in loaders) { + const loader = loaders[extension]; output.push({ - test: new RegExp('\\.' + extension + '$'), - loader: loader, + test: new RegExp(`\\.${extension}$`), + loader, }); } return output; diff --git a/webpack/webpack.base.conf.js b/webpack/webpack.base.conf.js index 688360839a..031bae9258 100644 --- a/webpack/webpack.base.conf.js +++ b/webpack/webpack.base.conf.js @@ -1,11 +1,16 @@ -var path = require('path'); -var config = require('./config'); -var utils = require('./utils'); -var projectRoot = path.resolve(__dirname, '../'); -var webpack = require('webpack'); +/* eslint-disable no-process-env, no-console */ -var IS_PROD = process.env.NODE_ENV === 'production'; -var baseConfig = { +const path = require('path'); +const config = require('./config'); +const utils = require('./utils'); +const projectRoot = path.resolve(__dirname, '../'); +const webpack = require('webpack'); +const autoprefixer = require('autoprefixer'); +const postcssEasyImport = require('postcss-easy-import'); +const IS_PROD = process.env.NODE_ENV === 'production'; +const eslintFriendlyFormatter = require('eslint-friendly-formatter'); + +const baseConfig = { entry: { app: './website/client/main.js', }, @@ -86,10 +91,10 @@ var baseConfig = { vue: { loaders: utils.cssLoaders(), postcss: [ - require('autoprefixer')({ + autoprefixer({ browsers: ['last 2 versions'], }), - require('postcss-easy-import')({ + postcssEasyImport({ glob: true, }), ], @@ -98,7 +103,7 @@ var baseConfig = { if (!IS_PROD) { baseConfig.eslint = { - formatter: require('eslint-friendly-formatter'), + formatter: eslintFriendlyFormatter, emitWarning: true, }; } diff --git a/webpack/webpack.dev.conf.js b/webpack/webpack.dev.conf.js index 492a4ea12c..2115202157 100644 --- a/webpack/webpack.dev.conf.js +++ b/webpack/webpack.dev.conf.js @@ -1,12 +1,12 @@ -var config = require('./config'); -var webpack = require('webpack'); -var merge = require('webpack-merge'); -var utils = require('./utils'); -var baseWebpackConfig = require('./webpack.base.conf'); -var HtmlWebpackPlugin = require('html-webpack-plugin'); +const config = require('./config'); +const webpack = require('webpack'); +const merge = require('webpack-merge'); +const utils = require('./utils'); +const baseWebpackConfig = require('./webpack.base.conf'); +const HtmlWebpackPlugin = require('html-webpack-plugin'); // add hot-reload related code to entry chunks -Object.keys(baseWebpackConfig.entry).forEach(function (name) { +Object.keys(baseWebpackConfig.entry).forEach((name) => { baseWebpackConfig.entry[name] = ['./webpack/dev-client'].concat(baseWebpackConfig.entry[name]); }); diff --git a/webpack/webpack.prod.conf.js b/webpack/webpack.prod.conf.js index 367260cc7a..88c76d9e09 100644 --- a/webpack/webpack.prod.conf.js +++ b/webpack/webpack.prod.conf.js @@ -1,16 +1,19 @@ -var path = require('path'); -var config = require('./config'); -var utils = require('./utils'); -var webpack = require('webpack'); -var merge = require('webpack-merge'); -var baseWebpackConfig = require('./webpack.base.conf'); -var ExtractTextPlugin = require('extract-text-webpack-plugin'); -var HtmlWebpackPlugin = require('html-webpack-plugin'); -var env = process.env.NODE_ENV === 'testing' - ? require('./config/test.env') - : config.build.env; +/* eslint-disable no-process-env, no-console */ -var webpackConfig = merge(baseWebpackConfig, { +const path = require('path'); +const config = require('./config'); +const utils = require('./utils'); +const webpack = require('webpack'); +const merge = require('webpack-merge'); +const baseWebpackConfig = require('./webpack.base.conf'); +const ExtractTextPlugin = require('extract-text-webpack-plugin'); +const HtmlWebpackPlugin = require('html-webpack-plugin'); +const CompressionWebpackPlugin = require('compression-webpack-plugin'); +const env = process.env.NODE_ENV === 'testing' ? + require('./config/test.env') : + config.build.env; + +const webpackConfig = merge(baseWebpackConfig, { module: { loaders: utils.styleLoaders({ sourceMap: config.build.productionSourceMap, extract: true }), }, @@ -43,9 +46,9 @@ var webpackConfig = merge(baseWebpackConfig, { // you can customize output by editing /index.html // see https://github.com/ampedandwired/html-webpack-plugin new HtmlWebpackPlugin({ - filename: process.env.NODE_ENV === 'testing' - ? 'index.html' - : config.build.index, + filename: process.env.NODE_ENV === 'testing' ? + 'index.html' : + config.build.index, template: './website/client/index.html', inject: true, minify: { @@ -61,12 +64,12 @@ var webpackConfig = merge(baseWebpackConfig, { // split vendor js into its own file new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', - minChunks: function (module, count) { + minChunks (scriptModule) { // any required modules inside node_modules are extracted to vendor return ( - module.resource && - /\.js$/.test(module.resource) && - module.resource.indexOf( + scriptModule.resource && + /\.js$/.test(scriptModule.resource) && + scriptModule.resource.indexOf( path.join(__dirname, '../node_modules') ) === 0 ); @@ -82,17 +85,11 @@ var webpackConfig = merge(baseWebpackConfig, { }); if (config.build.productionGzip) { - var CompressionWebpackPlugin = require('compression-webpack-plugin'); - webpackConfig.plugins.push( new CompressionWebpackPlugin({ asset: '[path].gz[query]', algorithm: 'gzip', - test: new RegExp( - '\\.(' + - config.build.productionGzipExtensions.join('|') + - ')$' - ), + test: new RegExp(`\\.(${config.build.productionGzipExtensions.join('|')})$`), threshold: 10240, minRatio: 0.8, }) diff --git a/website/client/main.js b/website/client/main.js index 7f61284b60..e1581bf11d 100644 --- a/website/client/main.js +++ b/website/client/main.js @@ -1,16 +1,15 @@ -// TODO verify if it's needed, added because Vuex require Promise in the global scope +// TODO verify if it's needed, added because Axios require Promise in the global scope // and babel-runtime doesn't affect external libraries require('babel-polyfill'); import Vue from 'vue'; -import VueResource from 'vue-resource'; +import axios from 'axios'; import AppComponent from './app'; import router from './router'; import store from './store'; import './filters/registerGlobals'; import i18n from './plugins/i18n'; -Vue.use(VueResource); Vue.use(i18n); // TODO just for the beginning @@ -18,8 +17,8 @@ let authSettings = localStorage.getItem('habit-mobile-settings'); if (authSettings) { authSettings = JSON.parse(authSettings); - Vue.http.headers.common['x-api-user'] = authSettings.auth.apiId; - Vue.http.headers.common['x-api-key'] = authSettings.auth.apiToken; + axios.defaults.headers.common['x-api-user'] = authSettings.auth.apiId; + axios.defaults.headers.common['x-api-key'] = authSettings.auth.apiToken; } const app = new Vue({ diff --git a/website/client/store/actions/tasks.js b/website/client/store/actions/tasks.js index 6357e9de5a..3fd777e8f8 100644 --- a/website/client/store/actions/tasks.js +++ b/website/client/store/actions/tasks.js @@ -1,6 +1,6 @@ -import Vue from 'vue'; +import axios from 'axios'; export async function fetchUserTasks (store) { - let response = await Vue.http.get('/api/v3/tasks/user'); - store.state.tasks = response.body.data; + let response = await axios.get('/api/v3/tasks/user'); + store.state.tasks = response.data.data; } \ No newline at end of file diff --git a/website/client/store/actions/user.js b/website/client/store/actions/user.js index 4320a156df..f8f46cbf0c 100644 --- a/website/client/store/actions/user.js +++ b/website/client/store/actions/user.js @@ -1,6 +1,6 @@ -import Vue from 'vue'; +import axios from 'axios'; export async function fetch (store) { // eslint-disable-line no-shadow - let response = await Vue.http.get('/api/v3/user'); - store.state.user = response.body.data; + let response = await axios.get('/api/v3/user'); + store.state.user = response.data.data; } \ No newline at end of file