Create-React-App是非常有趣的设置。
我开始从package.json npm脚本开始挖掘
“start”: “react-scripts start”
这将我带到node_modules / .bin下的二进制react脚本
我会在这里发布相关的东西。
switch (script) {
case 'build':
case 'eject':
case 'start':
case 'test': {
const result = spawn.sync(
'node',
[require.resolve('../scripts/' + script)].concat(args),
{ stdio: 'inherit' }
);
所以这告诉我他们正在寻找../scripts/文件夹里面的脚本。
所以我转到react-scripts npm模块(node_modules / react-scripts)并打开node_modules / react-scripts / scripts / start.js文件,因为我正在进行npm start。
现在我在这里找到了我正在寻找的webpack配置。
它们具体指的是node_modules / react-scripts / config / webpack.config.dev.js。我会在这里发布相关的东西。
entry: [
// Finally, this is your app's code:
paths.appIndexJs,
],
plugins: [
// Generates an `index.html` file with the
new HtmlWebpackPlugin({
inject: true,
template: paths.appHtml,
}),
所以paths.appIndexJs引用的文件是webpack配置中的条目文件。
他们使用HtmlWebpackPlugin在路径paths.appHtml上加载html。
拼图的最后一部分是将其链接到您发布的文件。
从paths.js发布相关内容
const appDirectory = fs.realpathSync(process.cwd());
const resolveApp = relativePath => path.resolve(appDirectory, relativePath);
module.exports = {
...
appHtml: resolveApp('public/index.html'),
appIndexJs: resolveApp('src/index.js'),
...
}
所以在你的应用程序目录中
appHtml是文件public / index.html
appIndexJs是文件src / index.js
你的两个文件有问题。哇!这是一段相当艰难的旅程..:P