index.html id,reactjs – React JS index.js文件如何联系index.html获取id引用？

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