Question

当我尝试运行服务时，我得到以下

ERROR in ./src/main/webapp/manifest.webapp
Module parse failed: /home/fergal/dev/jhipster/sam/git/sam/src/main/webapp/manifest.webapp Unexpected token (2:8)
You may need an appropriate loader to handle this file type.
| {
|   "name": "Sam",
|   "short_name": "Sam",
|   "icons": [
 @ ./src/main/webapp/app/polyfills.ts 6:0-29
 @ multi ./src/main/webapp/app/polyfills.ts
webpack: Failed to compile.
webpack: Compiling...

请参阅下面的webpack.dev.js的内容。不确定这是否是正确的文件。出了什么问题。或者我如何进一步调查它？任何指示/建议，非常感谢。

谢谢， Fergal。

const webpack = require('webpack');
const writeFilePlugin = require('write-file-webpack-plugin');
const webpackMerge = require('webpack-merge');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const execSync = require('child_process').execSync;
const fs = require('fs');
const path = require('path');

const commonConfig = require('./webpack.common.js');

const ddlPath = './target/www/vendor.json';
const ENV = 'dev';

if (!fs.existsSync(ddlPath)) {
    execSync('webpack --config webpack/webpack.vendor.js');
}

module.exports = webpackMerge(commonConfig({ env: ENV }), {
    devtool: 'inline-source-map',
    devServer: {
        contentBase: './target/www',
        proxy: [{
            context: [
                /* jhipster-needle-add-entity-to-webpack - JHipster will add entity api paths here */
                '/api',
                '/management',
                '/swagger-resources',
                '/v2/api-docs',
                '/h2-console'
            ],
            target: 'http://127.0.0.1:8080',
            secure: false
        }]
    },
    output: {
        path: path.resolve('target/www'),
        filename: 'app/[name].bundle.js',
        chunkFilename: 'app/[id].chunk.js'
    },
    module: {
        rules: [{
            test: /\.ts$/,
            loaders: [
                'tslint-loader','json-loader'
            ],
            exclude: ['node_modules', new RegExp('reflect-metadata\\' + path.sep + 'Reflect\\.ts')]
        }]
    },
    plugins: [
        new BrowserSyncPlugin({
            host: 'localhost',
            port: 9000,
            proxy: {
                target: 'http://localhost:9060'
            }
        }, {
            reload: false
        }),
        new ExtractTextPlugin('styles.css'),
        new webpack.NoEmitOnErrorsPlugin(),
        new webpack.NamedModulesPlugin(),
        new writeFilePlugin(),
        new webpack.WatchIgnorePlugin([
            path.resolve('./src/test'),
        ])
    ]});

Answer 1

你似乎在使用jhipster。在你的package.json中，你应该找到一组预定义的npm-scripts。当我使用jhipster生成一个新项目时，它不直接依赖于ng，而是直接使用webpack和生成的配置。

如果您依赖于npm而不是纱线，请尝试categories.find { |key, values| values.include?("bar") }.first（或yarn start。

问题的根本原因是angular-cli中的嵌入式webpack配置不知道如何处理* .webapp文件。

webpack目录中生成的webpack.common.js文件实际上定义了如何处理它：

npm run start

因此，使用上述命令而不是使用{ test: /manifest.webapp$/, loader: 'file-loader?name=manifest.webapp!web-app-manifest-loader' }应该可以解决问题。

ng服务失败 - webpack无法编译 - 错误在./src/main/webapp/manifest.webapp

1 个答案: