Question

Laravel混合正在将即时js代码添加到css文件中。因此，运行npm prod会导致错误CssSyntaxError：缺少分号。我将矩js导入Vue组件之一。

这是我的包json

"devDependencies": {
    "axios": "^0.19",
    "compass-mixins": "^0.12.10",
    "cross-env": "^5.1",
    "css-loader": "^3.2.0",
    "laravel-mix": "^4.0.7",
    "lodash": "^4.17.13",
    "resolve-url-loader": "^2.3.1",
    "sass": "^1.15.2",
    "sass-loader": "^7.1.0",
    "vue": "^2.5.17",
    "vue-router": "^3.1.2",
    "vue-template-compiler": "^2.6.10"
},
"dependencies": {
    "bootstrap-vue": "^2.0.0-rc.28",
    "vue-lodash": "^2.0.2",
    "vue-material-design-icons": "^3.3.1",
    "vue2-daterange-picker": "^0.3.1"
}

这是webpack.mix.js文件

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

这是我运行npm run watch之后在已编译的CSS中插入js代码的一部分

var map = {
"./af": "./node_modules/moment/locale/af.js",
"./af.js": "./node_modules/moment/locale/af.js",
"./ar": "./node_modules/moment/locale/ar.js",
"./ar-dz": "./node_modules/moment/locale/ar-dz.js"}

为什么会这样呢？

Answer 1

您需要添加以下插件：

plugins: [
    new webpack.IgnorePlugin({
        resourceRegExp: /^\.\/locale$/,
        contextRegExp: /moment$/
    }),
]

别忘了导入Webpack：

const webpack = require('webpack');

Laravel Mix将Moment JS代码添加到CSS中

1 个答案: