4

私は次のプロジェクトツリーを持っています

some-project
   some-project.component.ts
   some-project.html
   index.ts
   webpack.conf.js


another-project
    another-project.component.ts
    anpther-project.html
    index.ts
    webpack.conf.js

別のプロジェクトから webpack を実行していますが、一部のプロジェクトが別のプロジェクトにインポートされています。しかし、antoher-project の html-loader は some-project の html を認識しないようです

/some-project.html
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type.

この問題に対処するには?

ここに別のプロジェクトtsconfig.jsonの構成があります

{
  "awesomeTypescriptLoaderOptions": {
    "forkChecker": true,
    "useWebpackText": true,
    "transpileOnly": false
  },
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "lib": [
      "dom",
      "es2015"
    ],
    "types" : [
      "jquery",
      "jasmine",
      "angular-mocks",
      "angular-animate",
      "node"
    ],
    "typeRoots": [
      "node_modules/@types",
      "./node_modules",
      "./typings/global.d.ts"      
    ]
  },
  "files": [
    "src/index.ts"
  ],
  "exclude": [
    "node_modules"
  ]
}

webpack構成

{
    devtool: 'inline-source-map',
    entry: sourcePath + '/index.ts',
    output: {
        path: __dirname,
        filename: 'bundle.js'
    },
    externals: {
        "angular": "angular"
    },
    module: {
        rules: [{
                test: /\.ts$/,
                include: path.resolve('../../some-project/src'),
                exclude: /node_modules/,
                use: [
                    'awesome-typescript-loader'            
                ]
            },
            {
                test: /\.(html)$/,
                include: path.resolve('./src'),
                use: {
                    loader: 'html-loader',
                    options: {
                        minimize: true,
                        collapseWhitespace: true
                    }
                }
            }
        ]
    },
    resolve: {
        extensions: ['.ts', '.js'],
        modules: [
            path.resolve('./node_modules'),
            sourcePath
        ]
    },

    plugins:
    [
        new webpack.NamedModulesPlugin()
    ],

    stats: {
        colors: {
            green: '\u001b[32m',
        }
    }
}
4

1 に答える 1