При попытке скомпилировать файлы VUE с помощью веб-пакета возникла следующая ошибка, но эта ошибка возникает (я думаю) при компиляции значков дизайна материала.
[
»./node_modules/css-loader!./node_modules/postcss-loader/lib!(webpack)-material-design-icons/material-design-icons.css
Ошибка сборки модуля: синтаксическая ошибка
(4:12) Ненужная фигурная скобка
\ u001b [90м 2 | \ u001b [39м \ u001b [90м *
http://google.github.io/material-design-icons/ * / \ u001b [39м
\ u001b [90 м 3 | \ U001b [39m
\ u001b [31м \ u001b [1м>> u001b [22м \ u001b [39м \ u001b [90м 4 |
\ u001b [39м \ u001b [36м @ font-face \ u001b] [39м \ u001b [33м {\ u001b [39м]
\ u001b [90м | \ u001b [39м \ u001b [31м \ u001b [1м ^ ^ u001b [22м \ u001b [39м]
\ u001b [90м 5 | \ u001b [39m font-family \ u001b [33m: \ u001b [39m
\ u001b [32 м \ 'Material Icons \' \ u001b [39 м \ u001b [33 м; \ u001b [39 м]
\ u001b [90м 6 | \ u001b [39м шрифт \ u001b [33м: \ u001b [39м
нормальный \ u001b [33м; \ u001b [39m
@ (webpack) -material-design-icons / material-design-icons.css 2: 14-108
@ (webpack) -material-design-icons / index.js @ multi
WebPack-материал-дизайн-иконка,
»./node_modules/vue-loader/lib??vue-loader-options!C:/Users/sprgu/Workspace/fieldtec/formbird-frontend/src/App.vue?vue&type=style&index=0&lang=less
Ошибка разбора модуля: неожиданный символ \ '@ \' (14: 0)
соответствующий загрузчик для обработки этого типа файла. | | | @Импортировать
\ 'Активы / стили / main.less \'; | @
C: /Users/sprgu/Workspace/fieldtec/formbird-frontend/src/App.vue вю и тип = стиль и индекс = 0 & LANG = меньше
1: 0-175 1: 191-194 1: 196-368 1: 196-368 @
C: /Users/sprgu/Workspace/fieldtec/formbird-frontend/src/App.vue @
C: /Users/sprgu/Workspace/fieldtec/formbird-frontend/src/ClientApp.js
@ C: /Users/sprgu/Workspace/fieldtec/formbird-frontend/src/main.js '] [
'configuration' Параметр \ 'mode \' не был установлен. Установить режим\'
возможность "разработки" или "производства", чтобы включить значения по умолчанию для
эта среда. ']
Это мой полный файл webpack.config:
"use strict";
var webpack = require('webpack')
var path = require('path')
var extractTextPlugin = require('extract-text-webpack-plugin')
var VueLoaderPlugin = require('vue-loader/lib/plugin')
function resolve (dir) {
return path.join(__dirname, '../../formbird-frontend/', dir)
}
module.exports = {
entry: {
bundle: "../../formbird-frontend/src/main.js",
vendors: [
"webpack-material-design-icons"
]
},
output: {
path: path.join(__dirname, '../../formbird-frontend/dist/components'),
publicPath: '/',
filename: '[name].js',
chunkFilename: 'lazyload.[name].js',
sourceMapFilename: 'sourcemaps/bundle.map'
},
plugins: [
new webpack.ProvidePlugin({
"jQuery": "jquery",
"window.moment": "moment",
"window.jQuery": "jquery", // the window.jQuery mapping is needed so Angular will find jQuery and use the full jQuery
// rather than JQLite
"$": "jquery",
"window.$": "jquery"
}),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false,
vue: {
loaders: {
js: 'babel-loader',
css: extractTextPlugin.extract({
fallback: 'vue-style-loader',
use: [
{
loader: 'css-loader',
options: { importLoaders: 1 }
},
'postcss-loader'
]
})
}
}
}),
new VueLoaderPlugin()
],
resolve: {
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src')
},
extensions: ['*', '.js', '.vue', '.json']
},
// // set modules that are server-side only to empty so they won't be loaded in the browser
// node: {
// fs: "empty",
// // tls and net used in shared/utils/UtilBase64.js
// // from 8792: Create function to convert an image from an image url to Base64 encoding
// tls: "empty",
// net: "empty"
// },
bail: true, // make the build fail if there is a build error. If this wasn't true the build would succeed but an error would be
// shown in the app when the module that doesn't exist is loaded
module: {
// expose the jquery object to the global window. This is needed for jquery libraries like jSignature
rules: [
{
test: /\.vue$/,
use: 'vue-loader'
},
{
test: /\.js$/,
loader: 'babel-loader',
include: [resolve('src'), resolve('test')]
},
{
test: /(\.css$)/,
loaders: ['style-loader', 'css-loader', 'postcss-loader']
},
{
test: /\.(jpe?g|png|gif|svg|eot|woff|ttf|svg|woff2)$/,
loader: "file?name=[name].[ext]"
},
{
test: /\.(scss)$/,
use: [
{
loader: 'style-loader'
},
{
loader: 'css-loader'
},
{
loader: 'postcss-loader',
options: {
plugins: function () {
return [
require('precss'),
require('autoprefixer')
];
}
}
},
{
loader: 'sass-loader'
}
]
}
]
}
}
Что мне здесь не хватало? Пожалуйста, помогите мне. Мне не повезло с поиском проблем в Google. Спасибо!