未从webpack加载NPM包,Mix

xxb16uws  于 2022-09-21  发布在  Webpack
关注(0)|答案(1)|浏览(122)

我有一个拉威尔项目,就是利用webpack。在我的项目中,我已经有一些NPM包在运行,例如,jQuery。现在,我需要安装jQuery-UI来在我的应用程序中显示一些对话框。

我已经使用以下命令安装了jQuery-UI:

npm i jquery-ui --save-dev

我可以在NODE_MODULES中看到jQuery-UI文件夹,但它没有加载到我的应用程序中。

我还试图解压第二个vendor.js文件中的jQuery-UI包,但没有结果。

以下是我的webpack.Mix.js:

const mix = require('laravel-mix');

mix.setPublicPath('public')
    .setResourceRoot('../') // Turns assets paths in css relative to css file
    .vue()
    .sass('resources/sass/frontend/app.scss', 'css/frontend.css')
    .sass('resources/sass/backend/app.scss', 'css/backend.css')
    .js('resources/js/frontend/app.js', 'js/frontend.js')
    .js('resources/js/backend/app.js', 'js/backend.js')
    .extract([
        'alpinejs',
        'jquery',
        'bootstrap',
        'popper.js',
        'axios',
        'sweetalert2',
        'lodash'
    ])
    .extract(['jquery-ui'], 'js/vendor~utils-2.js')
    .sourceMaps();

if (mix.inProduction()) {
    mix.version();
} else {
    // Uses inline source-maps on development
    mix.webpackConfig({
        devtool: 'inline-source-map'
    });
}

下面是我的Package.json:

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "mix",
        "watch": "mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "prod": "npm run production",
        "production": "mix --production"
    },
    "devDependencies": {
        "@coreui/coreui": "^3.0.0",
        "@coreui/icons": "^1.0.1",
        "@fortawesome/fontawesome-free": "^5.12.1",
        "@popperjs/core": "^2.5.1",
        "alpinejs": "^2.3.5",
        "axios": "^0.21.1",
        "bootstrap": "^4.5.0",
        "cross-env": "^7.0",
        "jquery": "^3.5.1",
        "jquery-ui": "^1.13.2",
        "laravel-mix": "^6.0.6",
        "lodash": "^4.17.19",
        "perfect-scrollbar": "^1.5.0",
        "popper.js": "^1.16.1",
        "postcss": "^8.1",
        "resolve-url-loader": "^3.1.0",
        "sass": "^1.20.1",
        "sass-loader": "^8.0.0",
        "sweetalert2": "^9.8.2",
        "vue": "^2.5.17",
        "vue-loader": "^15.9.5",
        "vue-template-compiler": "^2.6.10"
    }
}

对我的错误之处有什么建议吗?

vktxenjb

vktxenjb1#

尝试导入app.js文件中的包

resources/js/backend/app.js

像这样

import jqueryui from 'jquery-ui'

相关问题