由于一個(gè)vue項(xiàng)目客戶需求,要把原來的后臺(tái)的單模版改成類似前臺(tái)的多模板形式,因?yàn)榍芭_(tái)頁面我用的PHP做的多模板,所以實(shí)現(xiàn)比較容易,但是在vue中沒有找到類似功能的Node模塊,所以打算自己搞一下,后端使用的是laravel框架,也就順帶用他自帶的laravel mix,但是不知道為什么在require一個(gè)變量路徑的vue組件是出現(xiàn)了各種錯(cuò)誤,哪位知道如何解決嗎?先謝啦
我在vue-router
里這樣調(diào)用
export default {
path: '',
component: require('../../../tool').view('DashBoard.vue'),
name: 'dashboard'
}
require 一個(gè)視圖變量 './template/default/views/' + $view
運(yùn)行正確
當(dāng)然,我們的default
是個(gè)變量,所以就開始出錯(cuò)了
view: function($view) {
let $template = 'default';
return require('./template/default/views/' + $view);
}
require 一個(gè)路徑,使用 $template
作為模板變量./template/' + $template + '/views/' + $view
運(yùn)行npm run dev就出錯(cuò)
view: function($view) {
let $template = 'default';
return require('./template/' + $template + '/views/' + $view);
}
require 一個(gè)路徑,使用視圖路徑做變量,也是出錯(cuò),編譯命令npm run dev 運(yùn)行正確,運(yùn)行程序出錯(cuò)app.js:12 Uncaught Error: Cannot find module "."
module.exports = {
view: function($view) {
let $template = './template/default/views/';
return require($template + $view);
}
};
請問該如何解決這個(gè)問題呢?謝謝...
認(rèn)證高級PHP講師
Webpack needs to determine dependencies to load and package modules, so it cannot require a dynamic path like node.
1. Violently use switch to make variables constant
2. Set context
Reference https://segmentfault.com/q/10...
3. Or use dynamic loading component mechanism
Webpack supports asynchronous loading of modules
require(['./xxx.vue'], function(module){
});
See vue official documentation