由于对webpack不太熟悉,所以在laravel5.4作为框架的项目中引用semantic UI出现了报错,部分代码如下:
// webpack.mix.js
module.exports.module={
rules:[
{
test: /\.(ttf|eot|svg)(\?v=[0-9]\.[0-9]\.[0-9])?$/,
loader: "file-loader"
}
]
};
mix.js('resources/assets/js/app.js', 'public/js')
.less('semantic/src/semantic.less', 'public/css')
.version();
报错信息是这样的
.........
89% additional chunk assets processing
94% asset optimization
95% emitting ERROR Failed to compile with 5 errors2:33:08 AM
These relative modules were not found:
* ./themes/themes/default/assets/fonts/icons.eot in ./~/css-loader!./~/postcss-loader!./~/less-loader?{}!./semantic/src/semantic.less
* ./themes/themes/default/assets/fonts/icons.woff2 in ./~/css-loader!./~/postcss-loader!./~/less-loader?{}!./semantic/src/semantic.less
* ./themes/themes/default/assets/fonts/icons.woff in ./~/css-loader!./~/postcss-loader!./~/less-loader?{}!./semantic/src/semantic.less
* ./themes/themes/default/assets/fonts/icons.ttf in ./~/css-loader!./~/postcss-loader!./~/less-loader?{}!./semantic/src/semantic.less
* ./themes/themes/default/assets/fonts/icons.svg in ./~/css-loader!./~/postcss-loader!./~/less-loader?{}!./semantic/src/semantic.less
Asset Size Chunks Chunk Names
images/flags.png?9c74e172f87984c48ddf5c8108cabe67 28.1 kB [emitted]
/js/app.dfd67ddfa096c5cdd88d.js 1.18 MB 0 [emitted] [big] /js/app
mix-manifest.json 53 bytes [emitted]
npm ERR! Darwin 16.4.0
npm ERR! argv "/usr/local/Cellar/node/7.7.1/bin/node" "/usr/local/lib/node_modules/npm/bin/npm-cli.js" "run" "dev"
npm ERR! node v7.7.1
npm ERR! npm v4.1.2
npm ERR! code ELIFECYCLE
npm ERR! @ dev: `node node_modules/cross-env/bin/cross-env.js 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 2
npm ERR!
npm ERR! Failed at the @ dev script 'node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js'.
npm ERR! Make sure you have the latest version of node.js and npm installed.
npm ERR! If you do, this is most likely a problem with the package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! node node_modules/cross-env/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
.........
Process finished with exit code 1
发现导致报错的原因是webpack在处理semantic UI中的字体文件时用的loader不对导致的,但是由于不熟悉前端的处理框架,暂时无法解决这个报错。请大神赐教~~