Maybe this can help some of you, we have a running test setup with Quasar 0.9.1 and Webpack 2. Won’t be perfect for direct usage because we integrated Quasar later into an existing plain vue.js project, but it should get you in the right direction:
Dependencies in package.json:
"devDependencies": {
"autoprefixer": "^6.4.0",
"babel-core": "^6.0.0",
"babel-eslint": "^7.0.0",
"babel-loader": "^6.0.0",
"babel-plugin-transform-runtime": "^6.0.0",
"babel-polyfill": "^6.16.0",
"babel-preset-es2015": "^6.0.0",
"babel-preset-stage-2": "^6.0.0",
"babel-register": "^6.0.0",
"chai": "^3.5.0",
"chalk": "^1.1.3",
"chromedriver": "^2.21.2",
"colors": "^1.1.2",
"connect-history-api-fallback": "^1.1.0",
"cross-spawn": "^4.0.2",
"css-loader": "^0.25.0",
"eslint": "^3.9.1",
"eslint-config-standard": "^6.2.1",
"eslint-friendly-formatter": "^2.0.5",
"eslint-loader": "^1.5.0",
"eslint-plugin-html": "^1.3.0",
"eslint-plugin-promise": "^3.3.0",
"eslint-plugin-standard": "^2.0.1",
"eventsource-polyfill": "^0.9.6",
"express": "^4.13.3",
"extract-text-webpack-plugin": "^2.0.0-beta.4",
"file-loader": "^0.9.0",
"function-bind": "^1.0.2",
"html-webpack-plugin": "^2.8.1",
"http-proxy-middleware": "^0.17.2",
"inject-loader": "^2.0.1",
"isparta-loader": "^2.0.0",
"json-loader": "^0.5.4",
"karma": "^1.3.0",
"karma-coverage": "^1.1.1",
"karma-mocha": "^1.2.0",
"karma-phantomjs-launcher": "^1.0.0",
"karma-sinon-chai": "^1.2.0",
"karma-sourcemap-loader": "^0.3.7",
"karma-spec-reporter": "0.0.26",
"karma-webpack": "^1.8.0",
"less": "^2.7.1",
"less-loader": "^2.2.3",
"lolex": "^1.4.0",
"mocha": "^3.1.0",
"opn": "^4.0.2",
"ora": "^0.3.0",
"phantomjs-prebuilt": "^2.1.3",
"postcss-loader": "^1.0.0",
"semver": "^5.3.0",
"shelljs": "^0.7.4",
"sinon": "^1.17.3",
"sinon-chai": "^2.8.0",
"style-loader": "^0.13.1",
"stylus": "^0.54.5",
"stylus-loader": "^2.1.1",
"url-loader": "^0.5.7",
"vue-loader": "^10.0.0",
"vue-style-loader": "^1.0.0",
"vue-template-compiler": "^2.1.3",
"webpack": "^2.1.0-beta.27",
"webpack-dev-middleware": "^1.8.4",
"webpack-dev-server": "^2.1.0-beta.12",
"webpack-hot-middleware": "^2.13.2",
"webpack-merge": "^0.18.0"
}
karma.conf.js:
// This is a karma config file. For more details see
// http://karma-runner.github.io/0.13/config/configuration-file.html
// we are also using it with karma-webpack
// https://github.com/webpack/karma-webpack
const
config = require('../../config'),
path = require('path'),
webpackConfig = require('../../build/webpack.test.conf'),
projectRoot = path.resolve(__dirname, '../../'),
webpack = require('webpack')
module.exports = function (config) {
config.set({
// to run in additional browsers:
// 1. install corresponding karma launcher
// http://karma-runner.github.io/0.13/config/browsers.html
// 2. add it to the `browsers` array below.
browsers: ['PhantomJS'],
frameworks: ['mocha', 'sinon-chai'],
reporters: ['spec', 'coverage'],
files: [
path.resolve(projectRoot, 'node_modules/babel-polyfill/dist/polyfill.js'),
'./index.js'
],
webpack: webpackConfig,
webpackMiddleware: {
stats: 'errors-only'
},
preprocessors: {
'./index.js': ['webpack', 'sourcemap']
},
coverageReporter: {
dir: './coverage',
reporters: [
{ type: 'lcov', subdir: '.' },
{ type: 'text-summary' }
]
}
})
}
webpack.test.conf.js:
var
config = require('../config/test.env'),
webpack = require('webpack'),
merge = require('webpack-merge'),
cssUtils = require('./css-utils'),
baseWebpackConfig = require('./webpack.base.conf'),
path = require('path'),
projectRoot = path.resolve(__dirname, '../')
var webpackConfig = merge(baseWebpackConfig, {
// use inline sourcemap for karma-sourcemap-loader
devtool: '#inline-source-map',
module: {
rules: cssUtils.styleRules()
},
plugins: [
new webpack.DefinePlugin({
'process.env': config,
'__THEME': 'mat'
})
]
})
module.exports = webpackConfig