webpack @nrwl/web不允许js文件

rbpvctlc  于 2023-04-06  发布在  Webpack
关注(0)|答案(1)|浏览(177)

bounty已结束。回答此问题可获得+50声望奖励。奖励宽限期将在4小时后结束。khex正在寻找来自信誉良好的来源的答案

我用@nrwl/web generator在nx monorepo中做了一个基本的web项目。webpack会阻止每个js文件,比如

<script src="assets/dist/js/bootstrap.bundle.min.js"></script>

甚至将脚本添加到project.json,它们也不会加载

"options": {
      ....
      "scripts": [
        "apps/web/src/assets/bootstrap.bundle.min.js"
      ]
    }

甚至在资源中隐藏js文件夹

yhuiod9q

yhuiod9q1#

问题可能与您的nx monorepo项目中Webpack的配置方式有关。您可以尝试以下几点来解决问题:
1.检查Webpack配置:检查Webpack是否配置为正确包含bundle中的js文件。您可以在Webpack配置文件(通常为webpack.config.js)中查找module.rules数组。确保处理.js文件的规则配置正确,以包含必要的文件。
2.检查资产文件夹结构:确保资产的文件夹结构正确,并且bootstrap.bundle.min.js文件位于正确的文件夹中。在您的情况下,它应该位于apps/web/src/assets/dist/js/中。
3.使用CopyWebpackPlugin:您可以使用CopyWebpackPlugin将必要的文件显式复制到输出文件夹。将以下代码添加到Webpack配置文件中:

const CopyWebpackPlugin = require('copy-webpack-plugin');

module.exports = {
  // ...
  plugins: [
    new CopyWebpackPlugin({
      patterns: [
        { from: 'apps/web/src/assets/dist/js/bootstrap.bundle.min.js', to: 'assets/dist/js' },
      ],
    }),
  ],
  // ...
};

这将把bootstrap.bundle.min.js文件复制到输出目录中的assets/dist/js文件夹。
4.检查网络选项卡:使用浏览器中的开发人员工具检查bootstrap.bundle.min.js文件是否正在加载。打开网络选项卡,检查是否有任何错误或文件是否由于某种原因未加载。
希望这些解决方案之一能帮助您解决问题。

相关问题