如何修复错误“您可能需要适当的加载程序来处理此文件类型" [英] How to fix the error "You may need an appropriate loader to handle this file type"
问题描述
我有一个全新的 Laravel 安装.使用 npm run dev VUE
编译文件时出现文件错误
您可能需要一个合适的加载器来处理此文件类型,目前没有配置加载器来处理此文件"
Laravel 版本:^8.12"
Package.json
devDependencies":{axios":^0.21",laravel-mix":^6.0.6",lodash":^4.17.19",vue":^2.5.17",vue-loader":^15.9.6",vue-template-compiler":^2.6.10";}
刀片文件
<你好></你好><script src="{{mix('js/app.js')}}"></script>
app.js
require('./bootstrap');从'vue'导入VueVue.component('hello', require('./hello.vue').default);const app = new Vue({el: '#app'});
Hello.vue
<div>你好,世界!
模板><脚本>导出默认{}
npm run dev
模块解析失败:意外令牌 (1:0)您可能需要一个合适的加载器来处理此文件类型,目前没有配置加载器来处理此文件.见 https://webpack.js.org/concepts#loaders><模板>|<div>|你好,世界!
当你使用 laravel-mix 6
它有不同的 webpack.mix.js 配置
webpack.mix.js
使用.vue()
const mix = require('laravel-mix');/*|--------------------------------------------------------------------------|混合资产管理|--------------------------------------------------------------------------||Mix 提供了一个干净、流畅的 API 来定义一些 Webpack 构建步骤|用于您的 Laravel 应用程序.默认情况下,我们正在编译 CSS|应用程序的文件以及捆绑所有 JS 文件.|*/mix.js('resources/js/app.js', 'public/js').vue().postCss('resources/css/app.css', 'public/css', [//]);
参考链接 https://laravel-mix.com/docs/6.0/upgrade
I have a fresh Laravel installation. On compiling files using npm run dev VUE
I get a file error
"You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file"
Laravel Verion: "^8.12"
Package.json
"devDependencies": {
"axios": "^0.21",
"laravel-mix": "^6.0.6",
"lodash": "^4.17.19",
"vue": "^2.5.17",
"vue-loader": "^15.9.6",
"vue-template-compiler": "^2.6.10"
}
blade file
<div id="app">
<hello></hello>
</div>
<script src="{{mix('js/app.js')}}"></script>
app.js
require('./bootstrap');
import Vue from 'vue'
Vue.component('hello', require('./hello.vue').default);
const app = new Vue({
el: '#app'
});
Hello.vue
<template>
<div>
Hello World!
</div>
</template>
<script>
export default {
}
</script>
npm run dev
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
> <template>
| <div>
| Hello World!
as your using laravel-mix 6
it have different config for webpack.mix.js
webpack.mix.js
use .vue()
const mix = require('laravel-mix');
/*
|--------------------------------------------------------------------------
| Mix Asset Management
|--------------------------------------------------------------------------
|
| Mix provides a clean, fluent API for defining some Webpack build steps
| for your Laravel applications. By default, we are compiling the CSS
| file for the application as well as bundling up all the JS files.
|
*/
mix.js('resources/js/app.js', 'public/js').vue()
.postCss('resources/css/app.css', 'public/css', [
//
]);
ref link https://laravel-mix.com/docs/6.0/upgrade
这篇关于如何修复错误“您可能需要适当的加载程序来处理此文件类型"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!