Question

我将在使用Vuejs作为前端的Symfony项目中编写单元测试。我想将Mocha框架用作组件测试的测试运行器。因此，我已按照此指南配置并安装了所有组件：testing vuejs apps

但是有一个问题，在我的项目中，我正在使用Encore，现在我在运行测试时遇到了一些麻烦。

我在根项目的以下目录中创建了setup.js文件：

- assets
    - js
        - components
        - test
            - setup.js

所以我在package.json中添加了以下配置：

"scripts": {
    "dev-server": "encore dev-server",
    "dev": "encore dev",
    "watch": "encore dev --watch",
    "build": "encore production",
    "compile-translations": "php bin/console bazinga:js-translation:dump public --format=js --merge-domains",
    "compile-routes": "php bin/console fos:js-routing:dump --target=public/js/fos_js_routes.js",
    "assets-install": "php bin/console assets:install --symlink --relative public",
    "test": "cross-env NODE_ENV=test nyc mocha-webpack --webpack-config webpack.config.js --require assets/js/test/setup.js assets/js/test/**/*.spec.js"
  },
  "nyc": {
    "include": [
      "assets/js/**/*.(js|vue)"
    ],
    "instrument": false,
    "sourceMap": false
  },

现在我有一个问题，我应该将此配置添加到我的webpack.config.js文件中

if (process.env.NODE_ENV === 'test'){

  module.exports.externals = [require('webpack-node-externals')()]
  module.exports.devtool = 'inline-cheap-module-source-map'

}

但是我正在使用Encore，该怎么办？

Answer 1

我使用业力解决了问题。对于有相同问题的任何人，您都应该遵循本指南：https://vue-test-utils.vuejs.org/guides/testing-single-file-components-with-karma.html

，然后在您的karma.conf.js文件的顶部添加以下行：

const Encore = require('@symfony/webpack-encore');

// Initialize Encore before requiring the .config file
Encore.configureRuntimeEnvironment('dev-server');

// Retrieve webpack config
const webpackConfig = require('./webpack.config.js');

Webpack Encore-Vuejs测试Mocha

1 个答案: