我正在使用 nwidart 的 laravel 模块为 laravel 应用程序创建单独的模块，每个模块都包含该模块的代码。目前我正在尝试将与每个模块相关的css文件放入单独的app.scss中，然后使用webpack将.scss移动到公共目录中。

我设法通过为每个模块包含单独的 webpack.mix 文件来实现此目的，将 css 移动到主公共目录。npm run dev然而，我的问题是，为了实现这一点，每次我想更新 css 时，我都必须在每个模块文件夹的根目录中运行该命令。有没有更简单的方法来运行应用程序中的所有模块 webpack.mix.js 文件，还是我每次都必须手动执行？

这是我正在使用的模块包https://github.com/nWidart/laravel-modules

这也是目录外观的示例

- 应用程序

----模块

------博客-> webpack.mix.js

- - - - 资源

- - - - - -资产

-------------Sass -> app.scss

这里还有博客模块的 webpack.mix.js 副本

const { mix } = require('laravel-mix');
require('laravel-mix-merge-manifest');

mix.setPublicPath('../../public').mergeManifest();

mix.sass( __dirname + '/Resources/assets/sass/app.scss', 'css/blog.css');

if (mix.inProduction()) {
    mix.version();
}

我有三个文件：

• my_function.js
• 脚本_1.js
• 脚本_2.js

my_function.js

function myFunction() {
  console.log('my function');
}

如何在我的文件scripts_1.js和中使用此功能scripts_2.js？我将这两个用作users.js：

require('scripts_1');
require('scripts_2');

我admins.js只使用一个：

require('scripts_2');

稍后，我将和文件webpack.mix.js编译为两个单独的缩小的 js 文件。usersadmin

require('my_function')如果我只是在我的scripts_1和文件中使用，scripts_2这不起作用（可能myFunction()不在同一范围内）。

但是，如果我将函数附加到window变量，我就可以完成这项工作，这样my_function现在看起来像这样：

window.myFunction = function() { ... }

此时，我什至不需要在任何scripts_1和scripts_2文件中要求它（但我在我的users.js和admin.js文件中要求它），但这在某种程度上感觉不对。

太棒了；

我想知道如何定义一个辅助 js 函数，我可以使用 Laravel MIX 在多个其他 js 文件中重用该函数。

我想将 css 和 js 的管理部分和用户部分放在单独的文件中。最好的方法是什么？我设置：`

mix.js('resources/js/app.js', 'public/js')
    .js('resources/js/admin/admin.js', 'public/js/admin')
    .sass('resources/sass/app.scss', 'public/css')
    .sass('resources/sass/admin.scss', 'public/css/admin');

` 但是我的资源文件夹结构应该如何才能防止所有内容重复？有任何指南如何最小化、分离或重组我的文件以获得更好的性能可读性吗？如何设置 laravel mix 来构建 2 个 js 和 2 个 css 以供不同用途。

我正在创建一个需要在临时服务器上从一个点创建的应用程序。因为在本地创建它是不可能的，因为它具有网络中其他服务器必须访问的一些端点。

我在 Vue.js 和 Laravel 中创建了一个应用程序。在本地，我曾经运行过npm run hot，这样当我更改一些代码时就不必重新编译。但由于我必须继续在实时服务器上开发此应用程序，因此我想npm run hot在自定义域（例如staging.something.com而不是localhost:8080.

localhost:8080如果以某种方式合作，我不会遇到任何问题，但是当我npm run hot在实时服务器上运行时，这是我尝试访问 Web 应用程序时收到的错误。

GET http://localhost:8080//js/app.js net::ERR_CONNECTION_REFUSED

我认为它应该显示我的服务器的 IP 地址而不是localhost. 我不知道这有什么问题，但它不起作用。

mix.react('resources/js/app.js', 'public/js')
   .react('resources/js/auth.js', 'public/js')
   .js('resources/js/core.js', 'public/js')
   .react('resources/js/workspace.js', 'public/js')
   .sass('resources/scss/app.scss', 'public/css')
   .sass('resources/scss/auth.scss', 'public/css')
   .sass('resources/scss/icons.scss', 'public/css')
   .sass('resources/scss/core.scss', 'public/css')
   .extract(['react', 'react-dom', 'react-router-dom'])

我正在使用上面的代码，react 正在被提取，但我的组件没有安装，我也想知道用 laravel mix 实现 React 代码分割的最佳方法。

伙计们，你们能帮我解决这个问题吗？我在为我的 Laravel Mix运行npm run dev 时遇到了问题。我按照下面的链接，但仍然存在错误。我的操作系统有问题吗？我试图删除 node_modules，运行 npm install --global cross-env。并再次运行 NPM 安装。

'cross-env' 不被识别为内部或外部命令，

https://github.com/JeffreyWay/laravel-mix/issues/478

我运行时总是遇到错误npm run dev：

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! @ development: `cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the @ development script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this …

当尝试安装 Laravel Mix时，它决定使用 引入依赖项npm。

是否可以告诉它使用纱线代替？

具体来说，正是这个命令引入了依赖项。

node_modules/.bin/webpack --config=node_modules/laravel-mix/setup/webpack.config.js

我无法优化tailwindcss与postCss使用laravel-mix和Scss。该npm run dev生成正确的CSS。但是，生产构建npm run prod不会导出我在HTML模板中使用的类。

包.json

{
  "name": "school",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "keywords": [],
  "author": "",
  "license": …

我当前的 webpack.mix.js 配置是：

mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css', [
    require('postcss-import'),
    require('tailwindcss'),
]).extract();

如果我有另一个 CSS，比如说“plugin-1.css”，我如何合并两者以便获得一个 app.css 的输出？

我尝试了 ['resources/css/app.css', 'plugin-1.css'] 但这不是一个选项。

我一直在学习 Laravel (8) 并且喜欢使用 tailwindcss。也就是说，我仍然希望使用 Bootstrap 做一些事情。我无法找到有关如何在 laravel 8 中使用 laravel mix 设置引导程序的文档。更具体地说，在resources/css/app.css文件中，我们将以下内容用于 tailwind：

@tailwind base;
@tailwind components;
@tailwind utilities;

但我不确定这里会有什么引导程序。

我注意到使用了旧版本的 Laravel，php artisan ui bootstrap但据我所见，这在 Laravel 8 中不可用。