WAMP 中的 Laravel 和 Vue —— 组件不编译，只是显示为它们的组件名称答案

【问题标题】：Laravel and Vue in WAMP -- components don't compile, just appear as their component namesWAMP 中的 Laravel 和 Vue —— 组件不编译，只是显示为它们的组件名称
【发布时间】：2019-01-30 03:58:06
【问题描述】：

我在 WAMP 中安装了 laravel 使用

composer create-project laravel/laravel mysite --prefer-dist

我可以在 localhost/mysite/public 访问启动页面。

根据the docs，我应该可以通过以下方式将 examplecomponent.vue 添加到此视图或任何其他视图中：

<example-component></example-component>

但是当我这样做时，我在页面和 HTML 源代码中的上述模板标记上什么也看不到。但不是实际的组件。

我跑了

npm install

和

npm run dev

但这并没有解决问题。

有什么我错过的吗？

【问题讨论】：

你检查开发者控制台了吗/
组件应该在 laravel 默认布局或者<div id="app"></div>之间
@Devon 控制台为空白
Mohammad b - 我试着把它放在 div#app 里面，没用
你修改了 webpack.mix.js 文件吗？如果没有，在浏览器上拉起 js 并找到 'example-component' 值可能会有用。

标签： laravel vue.js wamp

【解决方案1】：

Package.json

{
"private": true,
"scripts": {
    "dev": "npm run development",
    "development": "cross-env NODE_ENV=development node_modules/cross-env/dist/bin/cross-env.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "cross-env NODE_ENV=development node_modules/cross-env/dist/bin/cross-env.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch-poll": "npm run watch -- --watch-poll",
    "hot": "cross-env NODE_ENV=development node_modules/cross-env/dist/bin/cross-env.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "prod": "npm run production",
    "production": "cross-env NODE_ENV=production node_modules/cross-env/dist/bin/cross-env.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
},
"devDependencies": {
    "axios": "^0.18",
    "bootstrap": "^4.0.0",
    "cross-env": "^5.1",
    "jquery": "^3.2",
    "laravel-mix": "^2.0",
    "lodash": "^4.17.4",
    "vue": "^2.5.7"
  }
}

并修改你的 webpack.mix.js

将您的 package.json 与此进行比较。

npm install

npm run dev

【讨论】：

我该如何处理 webpack.mix.js？使用该 package.json 编译失败 - '--progress' 未被识别为内部或外部命令、可运行程序或批处理文件。 events.js:183 抛出错误； // 未处理的 'error' 事件 ^ 错误：在 verifyENOENT (C:\wamp64) 处生成 --progress ENOENT at notFoundError (C:\wamp64\www\mysite\node_modules\cross-spawn\lib\enoent.js:6:26) \www\mysite\node_modules\cross-spawn\lib\enoent.js:40:16) 在 ChildProcess.cp.emit