Web-pack 只转译入口点 js 文件而不转译其余部分

Question

大家好，我正在设置我的开发服务器，我希望 webpack 搜索每个 .js 文件并使用 babel 转译它们。按照目前的设置，我的 bundle.js 只包括我的入口点的内容，而不包括项目目录中的其他 js 文件。有小费吗？

这是我的 webpack 配置

module.exports = {

    entry: './app/src/index.js',
    output:{
        path: __dirname,
        publicPath:'/',
        filename: 'bundle.js'
    },
    devServer:{
        inline: true,
        contentBase:'./',
        port: 61116

    },
    module: {
        loaders: [
            {
                test:  /\.js$/,
                exclude:/(node_modules)/,
                loader: 'babel-loader',
                query: {
                    presets: ["es2015", "react", "stage-1"]
                } 
            },
            {
                test: /\.css$/,
                loader:"style-loader!css-loader"
            },
             {
                test: /\.html$/,
                loader:"html-loader"

            }
        ]
    }
}

这是我的文件夹结构

入口点index.js

import React from 'react' ;
import ReactDOM from 'react-dom';

console.log("This ran");
const  App = () =>{
    return (<p>This is a new app</p>);
}


ReactDOM.render(<App />, document.querySelector(".react-container"));

知道我哪里出错了吗？

Answer 1

正如 IsenrichO 在评论中暗示的那样，您似乎没有从组件文件夹中包含 "index.js"。任何不是首先由入口点导入的文件，或入口点导入的任何文件，等等，都不会被转译。

试试 import IndexComponent from "./components/index";，或者你的索引组件 class 的任何名称。

Web-pack 只转译入口点 js 文件而不转译其余部分

Web-pack only transpiling the entry point js file but not the rest

javascript

reactjs

webpack

webpack-dev-server