Laravel5.3 & Vue.js 2.0 ----- package.json 和 gulp 配置
说明:最近我使用
laravel5.3
和vue.js 2.0
,但是编译完成后一直报错,所以我就找了下原因,原因大概是laravel5.3
工程中:npm
的package.json
配置文件大都还是用的 vue.js 1.0 版本的插件。
所以应该找对应2.0版本的插件修改掉,建议一开始就在 package.json 中把不需要或者过旧的包删除掉
下面是比较新的插件包:
---- package.json
{
"private": true,
"scripts": {
"prod": "gulp --production",
"dev": "gulp watch"
},
"devDependencies": {
"gulp": "^3.9.1",
"laravel-elixir": "^6.0.0-15",
"laravel-elixir-vue-2": "^0.3.0", // 项目根目录 gulp.js 中要相应改掉
"laravel-elixir-webpack-official": "^1.0.10",
"lodash": "^4.14.0",
"vue": "^2.1.10",
"vue-loader": "^11.1.2",
"vue-resource": "^1.2.0",
"vue-router": "^2.2.1"
}
}
---gulp.js
const elixir = require('laravel-elixir');
require('laravel-elixir-vue-2');
/*
|--------------------------------------------------------------------------
| Elixir Asset Management
|--------------------------------------------------------------------------
|
| Elixir provides a clean, fluent API for defining some basic Gulp tasks
| for your Laravel application. By default, we are compiling the Sass
| file for our application, as well as publishing vendor resources.
|
*/
elixir(mix => {
mix.sass('app.scss')
.webpack('main.js');
});