karma 4.0.1、webpack 4.31.0、angular 1.6.8、karma-jasmine 2.0.1、jasmine-core 3.4.0
仕事で、angularjsアプリを古い学校のgulpビルドプロセスからwebpack + es6に変換しました。プロセスが順調に進んでいる途中で、いくつかの頭痛やしゃっくりを除けば。それは今までです。
Karmaはすべてのテストを正常に実行していますが、すべてのテストに合格していますが、Karmaはコード1で終了し、調査するファイル名または行番号がないエラーをスローします。
私は2日間グーグルをしていて、さまざまなことを試しましたが、これまでのところ成功していません。どんな助けでも大歓迎です。
14 05 2019 13:27:49.456:INFO [karma-server]: Karma v4.0.1 server started at http://0.0.0.0:10002/
14 05 2019 13:27:49.457:INFO [launcher]: Launching browsers ChromeHeadless-C with concurrency unlimited
14 05 2019 13:27:49.528:INFO [launcher]: Starting browser ChromeHeadless
14 05 2019 13:27:50.081:INFO [HeadlessChrome 74.0.3729 (Mac OS X 10.14.4)]: Connected on socket U30VLDHr805gOx4vAAAA with id 50392440
HeadlessChrome 74.0.3729 (Mac OS X 10.14.4) ERROR
{
"message": "An error was thrown in afterAll\nSyntaxError: Unexpected string",
"str": "An error was thrown in afterAll\nSyntaxError: Unexpected string"
}
HeadlessChrome 74.0.3729 (Mac OS X 10.14.4): Executed 1964 of 1964 ERROR (11.787 secs / 0 secs)
0 info it worked if it ends with ok
1 verbose cli [ '/Users/riegersn/.nvm/versions/node/v8.9.4/bin/node',
1 verbose cli '/Users/riegersn/.nvm/versions/node/v8.9.4/bin/npm',
1 verbose cli 'run',
1 verbose cli 'test' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'pretest', 'test', 'posttest' ]
5 info lifecycle [email protected]~pretest: [email protected]
6 info lifecycle [email protected]~test: [email protected]
7 verbose lifecycle [email protected]~test: unsafe-perm in lifecycle true
8 verbose lifecycle [email protected]~test: PATH: /Users/riegersn/.nvm/versions/node/v8.9.4/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/Users/riegersn/vesi/vpower-ui/node_modules/.bin:/Users/riegersn/.nvm/versions/node/v8.9.4/bin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin
9 verbose lifecycle [email protected]~test: CWD: /Users/riegersn/vesi/vpower-ui
10 silly lifecycle [email protected]~test: Args: [ '-c', 'karma start' ]
11 silly lifecycle [email protected]~test: Returned: code: 1 signal: null
12 info lifecycle [email protected]~test: Failed to exec test script
13 verbose stack Error: [email protected] test: `karma start`
13 verbose stack Exit status 1
13 verbose stack at EventEmitter.<anonymous> (/Users/riegersn/.nvm/versions/node/v8.9.4/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:301:16)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at EventEmitter.emit (events.js:214:7)
13 verbose stack at ChildProcess.<anonymous> (/Users/riegersn/.nvm/versions/node/v8.9.4/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at ChildProcess.emit (events.js:214:7)
13 verbose stack at maybeClose (internal/child_process.js:925:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
14 verbose pkgid [email protected]
15 verbose cwd /Users/riegersn/vesi/vpower-ui
16 verbose Darwin 18.5.0
17 verbose argv "/Users/riegersn/.nvm/versions/node/v8.9.4/bin/node" "/Users/riegersn/.nvm/versions/node/v8.9.4/bin/npm" "run" "test"
18 verbose node v8.9.4
19 verbose npm v6.5.0
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] test: `karma start`
22 error Exit status 1
23 error Failed at the [email protected] test script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
var webpackConfig = require('./webpack.config.js')({ development: true });
module.exports = function (config) {
config.set({
basePath: './',
frameworks: ['jasmine'],
files: [
'./app/init.js',
'./node_modules/angular-mocks/angular-mocks.js',
'./test/lib/**/*.js',
'./test/mock/**/*.js',
'./app/**/*.mock.js',
'./app/**/*.spec.js'
],
webpack: webpackConfig,
reporters: ['progress'],
preprocessors: {
'./app/init.js': 'webpack'
},
port: 9999,
browserNoActivityTimeout: 60000,
logLevel: config.LOG_INFO,
autoWatch: false,
singleRun: true,
browsers: ['ChromeHeadless-C'],
customLaunchers: {
'ChromeHeadless-C': {
base: 'ChromeHeadless',
flags: ['--disable-web-security']
},
'Chrome-C': {
base: 'Chrome',
flags: ['--disable-translate', '--disable-extensions', '--disable-web-security']
}
},
plugins: [
'karma-jasmine',
'karma-webpack',
'karma-chrome-launcher',
// 'karma-sourcemap-loader'
],
client: {
jasmine: {
random: false
}
}
});
};
const webpack = require('webpack');
const path = require('path');
const vpowerHost = require('./tools/vpowerHost');
const CopyPlugin = require('copy-webpack-plugin');
const Autoprefixer = require('autoprefixer');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const log = function() {
console.log('webpack-config ::', ...arguments);
};
module.exports = env => {
const HOST = vpowerHost(process.env.NODE_ENV);
log('host ->', HOST);
log('build mode ->', env.production ? 'production' : 'development');
let config = {
context: path.resolve(__dirname, 'app'),
entry: './init.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].js'
},
resolve: {
alias: {
'@Products': path.resolve(__dirname, 'app/products/'),
'@Components': path.resolve(__dirname, 'app/shared/components/'),
'@Controllers': path.resolve(__dirname, 'app/shared/controllers/'),
'@Direcctives': path.resolve(__dirname, 'app/shared/directives/'),
'@Filters': path.resolve(__dirname, 'app/shared/filters/'),
'@Modals': path.resolve(__dirname, 'app/shared/modals/'),
'@Models': path.resolve(__dirname, 'app/shared/models/'),
'@Services': path.resolve(__dirname, 'app/shared/services/'),
'@Views': path.resolve(__dirname, 'app/shared/views/')
}
},
module: {
rules: [
{
test: require.resolve('jquery'),
loader: 'expose-loader?jQuery!expose-loader?$'
},
{
test: require.resolve('moment'),
loader: 'expose-loader?moment'
},
{
test: /\.js$/,
loader: 'babel-loader',
include: path.resolve(__dirname, 'app'),
exclude: /node_modules/,
options: {
presets: ['@babel/preset-env']
}
},
{
test: /\.html$/,
loader: 'html-loader',
include: path.resolve(__dirname, 'app'),
options: {
root: path.resolve(__dirname, 'assets'),
attrs: ['img:src'],
minimize: env.production,
removeComments: env.production,
collapseWhitespace: env.production
}
},
{
test: /\.css$/,
use: [env.production ? MiniCssExtractPlugin.loader : 'style-loader', 'css-loader']
},
{
test: /\.scss$/,
use: [
env.production ? MiniCssExtractPlugin.loader : 'style-loader',
'css-loader',
{
loader: 'postcss-loader',
options: {
plugins: () => [Autoprefixer()]
}
},
'sass-loader'
]
},
{
test: /\.(png|jpe?g|svg)$/,
loader: 'file-loader',
options: {
limit: 8000,
name: 'images/[name].[ext]'
}
},
{
test: /\.(jpg|png|gif|svg)$/,
loader: 'image-webpack-loader',
enforce: 'pre'
},
{
test: /\.(woff|woff2|eot|ttf)$/,
loader: 'file-loader?limit=100000',
options: {
name: 'fonts/[name].[ext]'
}
}
]
},
plugins: [
new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),
new CopyPlugin([
{
from: __dirname + '/assets/json',
to: __dirname + '/dist/json'
},
{
from: __dirname + '/node_modules/amcharts-src/amcharts/plugins/export/libs',
to: __dirname + '/dist/amcharts/libs'
},
{
from: __dirname + '/node_modules/amcharts-src/amcharts/images',
to: __dirname + '/dist/amcharts/images'
}
]),
new MiniCssExtractPlugin({
filename: '[name].css',
chunkFilename: '[id].css'
}),
new HtmlWebpackPlugin({
template: 'index.html',
favicon: '../assets/images/favicon.ico',
inject: true
})
],
devServer: {
host: 'localhost',
port: 9000,
hot: true,
proxy: {
'/isoneplc': 'http://localhost:9001',
'/csv-convert': 'http://localhost:9001'
},
allowedHosts: [
'#####.localhost',
'#####.localhost',
'#####.localhost',
'#####.localhost',
'#####.localhost',
'#####.localhost',
'#####.localhost'
]
}
};
config.mode = env.production ? 'production' : 'development';
if (env.production) {
log('adding source maps');
log('adding optimizations');
config.devtool = 'source-map';
config.optimization = {
minimizer: [
new UglifyJsPlugin({
parallel: true
}),
new OptimizeCSSAssetsPlugin({
cssProcessorPluginOptions: {
preset: ['default', { discardComments: { removeAll: true } }]
}
})
],
splitChunks: {
chunks: 'all'
}
};
config.plugins.push(new BundleAnalyzerPlugin());
} else if (env.production && HOST === '##########.com') {
config.devtool = 'source-map';
log('adding source maps');
}
return config;
};
[email protected]パッケージのデバッグ後、lib / adapter.js：170で、処理される前に結果オブジェクトを出力することができました。オブジェクトには、エラーのファイル名と行番号、テストの実行時に提供されなかった情報が含まれていました。
原因は、webpackによって処理されていないes6 jsファイルでした。ブラウザーは、いくつかのes6コードに遭遇し、それを処理する方法を知りませんでした。ファイルは実際には不要だったので、削除するとこの問題は解決しました。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加