tookit / vue-material-admin Goto Github PK
View Code? Open in Web Editor NEWA vue material design admin template
Home Page: http://vma.isocked.com/#/dashboard
A vue material design admin template
Home Page: http://vma.isocked.com/#/dashboard
This is not an issue but i need to convert it to laravel mix, so how can i do this
I install new version, install some plugins manually such as less, but it can not run:
> [email protected] dev D:\work\vue-material-admin-master
> webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
94% after seal
ERROR Failed to compile with 1 errors 06:36:22
error in ./src/main.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In D:\work\vue-material-admin-master\node_modules\babel-preset-stage-2\lib\index.js
at createDescriptor (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-descriptors.js:178:11)
at items.map (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-descriptors.js:109:50)
at Array.map (native)
at createDescriptors (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-descriptors.js:109:29)
at createPresetDescriptors (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-descriptors.js:101:10)
at presets (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-descriptors.js:47:19)
at mergeChainOpts (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-chain.js:315:26)
at D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-chain.js:278:7
at buildRootChain (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\config-chain.js:118:22)
at loadPrivatePartialConfig (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\partial.js:57:55)
at Object.loadPartialConfig (D:\work\vue-material-admin-master\node_modules\@babel\core\lib\config\partial.js:82:18)
at Object.<anonymous> (D:\work\vue-material-admin-master\node_modules\babel-loader\lib\index.js:140:26)
at Generator.next (<anonymous>)
at asyncGeneratorStep (D:\work\vue-material-admin-master\node_modules\babel-loader\lib\index.js:3:103)
at _next (D:\work\vue-material-admin-master\node_modules\babel-loader\lib\index.js:5:194)
at D:\work\vue-material-admin-master\node_modules\babel-loader\lib\index.js:5:364
@ multi (webpack)-dev-server/client?http://localhost:8081 (webpack)/hot/dev-server.js ./src/main.js
The plugin extract-text-webpack-plugin should upgrade to 4.0.0-beta.0, the webpack 4.0 does not support v3.0.2
I have put inside src/router/index.js, in beforeEach guard, axios call for auth service. But when user not logged in, its expected that he is redirected to /login route. But, dashboard layout is loaded for a 1s, then redirection is performed.
Expected flow is that dashboard is not showing at all, redirection must be performed instantly.
upgrade to babel7
Hi tookit,
The latest vuetify version is 1.3.4, would you like to update vuefity to the new Version?
there is just a dash in the place where breadcrumb should showed without icon and path on each page
The demo website just works fine. But when I read the source code and run yarn serve
locally, there is error.
From the source code I can see that the component AppDrawer
has a prop named showDrawer
, which gets value from its parent component DefaultLayout
and change the visibility of the drawer when the toolbar icon is clicked. But when the device width is not enough, drawer shows as a layout and covers the toolbar icon, the drawer can only be closed by clicking the area out of the drawer. In this case, the prop showDrawer
is changed by AppDrawer
itself and the parent component DefaultLayout
doesn't aware of this at all.
Thus the result is that there are Vue Warning errors in console and the next time you want to open the drawer, you must click the toolbar icon twice because the variable showDrawer
must change from true
to false
and then to true
again.
What confuses me most is the Internet website works just fine but localhost don't. What can be sure is the usage of prop showDrawer
is wrong. Any good idea solving it?
I'll update if i get any good idea about this.
Hi!
I'm having trouble to add a new font to the project. My last attempt was placing them inside the static folder. I created a /static/css folder with the icon.css file and a /static/fonts folder with the ttf file there.
On the css I have the font face declaration as follows:
@font-face {
font-family: "Flaticon";
url("../fonts/Flaticon.ttf") format("truetype"),
font-weight: normal;
font-style: normal;
}
But when I try to use its classes inside the code nothing is shown and I realized that it seems that the ttf file is not being loaded on the generated code.
What am I doing wrong?
Really appreciate any help.
Thanks!
Now the latest version is 1.5.1 which introduced a lot of bug fixes and new features.
ERROR in static/js/vendor.52742d45700d8b43d148.js from UglifyJs
undefined
Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: node build/build.js
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
1 verbose cli 'C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js',
1 verbose cli 'run',
1 verbose cli 'build' ]
2 info using [email protected]
3 info using [email protected]
4 verbose run-script [ 'prebuild', 'build', 'postbuild' ]
5 info lifecycle [email protected]prebuild: [email protected]build: [email protected]
6 info lifecycle [email protected]
7 verbose lifecycle [email protected]build: unsafe-perm in lifecycle truebuild: PATH: C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\node-gyp-bin;C:\Users\nazih\Desktop\Vue_test\mosalawebapp\node_modules.bin;C:\WINDOWS\system32;C:\WINDOWS;C:\WINDOWS\System32\Wbem;C:\WINDOWS\System32\WindowsPowerShell\v1.0;C:\Program Files (x86)\Microsoft SQL Server\140\Tools\Binn;C:\Program Files\Microsoft SQL Server\140\Tools\Binn;C:\Program Files (x86)\Microsoft SQL Server\140\DTS\Binn;C:\Program Files\Microsoft SQL Server\140\DTS\Binn;C:\Program Files\Microsoft SQL Server\Client SDK\ODBC\130\Tools\Binn;C:\Program Files (x86)\Microsoft SQL Server\Client SDK\ODBC\130\Tools\Binn;C:\Program Files (x86)\Microsoft SQL Server\140\Tools\Binn\ManagementStudio;C:\Program Files\dotnet;C:\Program Files\Microsoft SQL Server\130\Tools\Binn;C:\Program Files\Git\cmd;C:\Program Files (x86)\Brackets\command;C:\WINDOWS\System32\OpenSSH;C:\Program Files\Microsoft VS Code\bin;C:\Program Files\nodejs;C:\Users\nazih\AppData\Local\Microsoft\WindowsApps;C:\Program Files\Microsoft VS Code\bin;;C:\Users\nazih\AppData\Local\Programs\Microsoft VS Code\bin;C:\Users\nazih\AppData\Roaming\npm
8 verbose lifecycle [email protected]
9 verbose lifecycle [email protected]build: CWD: C:\Users\nazih\Desktop\Vue_test\mosalawebappbuild: Args: [ '/d /s /c', 'node build/build.js' ]
10 silly lifecycle [email protected]
11 silly lifecycle [email protected]build: Returned: code: 1 signal: nullbuild: Failed to exec build script
12 info lifecycle [email protected]
13 verbose stack Error: [email protected] build: node build/build.js
13 verbose stack Exit status 1
13 verbose stack at EventEmitter. (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\index.js:301:16)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at EventEmitter.emit (events.js:214:7)
13 verbose stack at ChildProcess. (C:\Program Files\nodejs\node_modules\npm\node_modules\npm-lifecycle\lib\spawn.js:55:14)
13 verbose stack at emitTwo (events.js:126:13)
13 verbose stack at ChildProcess.emit (events.js:214:7)
13 verbose stack at maybeClose (internal/child_process.js:915:16)
13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5)
14 verbose pkgid [email protected]
15 verbose cwd C:\Users\nazih\Desktop\Vue_test\mosalawebapp
16 verbose Windows_NT 10.0.17134
17 verbose argv "C:\Program Files\nodejs\node.exe" "C:\Program Files\nodejs\node_modules\npm\bin\npm-cli.js" "run" "build"
18 verbose node v8.15.0
19 verbose npm v6.4.1
20 error code ELIFECYCLE
21 error errno 1
22 error [email protected] build: node build/build.js
22 error Exit status 1
23 error Failed at the [email protected] build script.
23 error This is probably not a problem with npm. There is likely additional logging output above.
24 verbose exit [ 1, true ]
Can you please update vuetifty to 1.1.14 (latest stable version) ?
I realize this is a project showcasing your work. It also functions as a 'major' help to the part of the community that is learning (which I'm a part of). Thank you for posting this repo. I'm gaining a lot from looking through!!!
TLDR: When hovering over a menu selection while in 'Dark' mode, text is extremely hard to read. Needs to be a different color, or match the background of the menu.
Hi,
Is the latest version of the project created using
vue create my-app
, then vue add vuetify
, then choose Default (recommended)
, just like what Vuetify website(https://vuetifyjs.com/en/getting-started/quick-start) recommended?
Hey,
I tried following the instructions in the Readme. I cloned the repository and ran npm install
.
I resolved some unmet dependencies that npm
warned me about (not sure if they are related to the project) using:
npm install less@^3.0.0
npm install ajv@^6.0.0
When trying to run the server using npm run dev
, I get the following error:
Failed to compile with 1 errors
This dependency was not found:
* @/components/widgets/card/NameCard in ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/pages/widgets/Social.vue
To install it, you can run: npm install --save @/components/widgets/card/NameCard
I would appreciate help on this issue.
Thanks.
node -v
v10.6.0
npm -v
6.1.0
Is there a simple way to get the y-axis in the Box chart to start from the lowest point instead of 0?
So if values range from 13000 to 14000, 13000 is the lowest on the y-axis and 14000 the highest. Instead of 0 being the lowest point on the y-axis.
This would make the chart much more dynamic. Right now it's not really dynamic. See image attached:
I want to get a simple empty frame to start my app without test script. How can I get it?
please this v-navigation-drawer don't change active menu, just first item is active in my exemple of i set like you. thanks for helpe!
Hi
I have installed and run vue-material admin.
All are working well but assets images are not loaded.
Please advise me.
The Echarts Vue Wrapper in echart.js is NOT reactive. Data changes do not update the chart(s) unless page is refreshed.
Furthermore, if the chart has data and then, for example, a filter is applied that returns no data, the chart data will not be cleaned, so the chart will still show the old data instead of no data.
The above can be fixed by adding a watcher that watches pathOption and calls this.init() on data change (for data updates) and for clearing the data, it can call this.clean() after checking if the data is empty.
watch: {
pathOption: function (data) {
if (data[0][1].length < 1) {
this.clean();
}
this.init();
}
}
I can submit a pull request once I get a bit more time.
Hello, are you still considering to continue to improve? For example, to enhance some multi-label functions, and to solve the problem that the iframe box will be refreshed when switching labels, this is still useful for a management system. Also included to improve some permissions and other issues, such as https://panjiachen.github.io/vue-element-admin/#/dashboard. Thank you.
Is posible use the dashboard, with de vue cli 3, via vue add....
Can i challenge you to convert this awesome work to nuxtjs?
in login,empty username and password still suceess login
In AppFab page ,I set var to display a Fab to scroll to top ,but pages scroll to top the fab always display.
`export default {
name: 'app-fab',
data: () => ({
fab: true
}),
methods: {
onScroll()
{
alert(typeof window === 'undefined');
if (typeof window === 'undefined') return;
const top = window.pageYOffset || document.documentElement.offsetTop || 0;
this.fab = top > 300;
},
toTop ()
{
this.$router.push({ hash: '' });
this.$vuetify.goTo(0);
}
}
};
</script>`
if set fab is false , also seem.
resovled:
mounted () {
window.addEventListener ('scroll',this.onScroll);
},
sorry if it is irrelevant.
I have already set up my project using vuetify nuxt. I just want to use this theme in my project.
Hello Master,
We are using your vue.js admin theme , this works fine with dev. But once we build this theme then it continuously disconnecting the server and restart it.
xx PM2 > App [bidkakhel_admin:0] exited with code [0] via signal [SIGINT]
xx PM2 > App [bidkakhel_admin:0] starting in -fork mode-
xx PM2 > App [bidkakhel_admin:0] online
xx PM2 > App [bidkakhel_admin:0] exited with code [0] via signal [SIGINT]
Do you have any solution for us sir ?
Thank You,
Uresh
After cloning this repo I'm experiencing an error I can't get past:
$ npm install
$ npm run dev
gives:
ERROR Failed to compile with 1 errors
error in ./src/router/paths.js
Syntax Error: Unexpected token (18:21)
16 | },
17 | name: 'NotFound',
> 18 | component: () => import(
| ^
19 | /* webpackChunkName: "routes" */
20 | /* webpackMode: "lazy-once" */
21 | `@/pages/NotFound.vue`
@ ./src/router/index.js 3:0-28
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js`
TIA
老铁,你的github留的邮箱是这个:[email protected]
但这个demo里,http://vma.isocked.com/#/dashboard, HIRE ME,这里,邮箱是错的, 你自己看一下哈。
写错啦。。。
Greetings, cloning your repo in Ubuntu, the following file is throwing an error:
src/components/widgets/card/NameCard.Vue
It appears the capital "V" is throwing off the webpack import. Great Admin template, thanks!
Hey there! Love the work!
I was wondering whether you have any best practice to integrate this dashboard with nuxt?
Thank you for your useful source code
Currently I would like to fix position of header, I have investigate that current vuetify are not supported, this feature will support in vuetify 2+. link
Could you please upgrade vuetify to 2+. I have try it, but not sucessful.
Thank you.
Good Morning,
Great work, the project is very helpful.
I have downloaded the latest version from the repository.
When I run appears this error, how can I solve it?
Thanks!
The output is:
npm run serve
[email protected] serve /Documents/Workspace/vue-material-admin
vue-cli-service serve
INFO Starting development server...
98% after emitting CopyPlugin
ERROR Failed to compile with 1 errors
error in ./src/router/paths.js
Module parse failed: Unexpected token (16:11)
You may need an appropriate loader to handle this file type.
name: 'NotFound',
component: function component() {
return import(
/* webpackChunkName: "routes" */
"@/views/NotFound.vue");
file /theme/default.styl
missed images
and responsive
component,
it cases the v-img
compontent does not work,
after I add
/*------------------------------------------------------------------
[Components _images]
*/
@import '~vuetify/src/stylus/components/_images'
/*------------------------------------------------------------------
[Components _responsive]
*/
@import '~vuetify/src/stylus/components/_responsive'
to the file /theme/default.styl
,v-img
can work again;
ERROR Failed to compile with 1 errors 22:44:41
error in ./node_modules/core-js/modules/es6.regexp.exec.js
Module parse failed: Unexpected character ' ' (1:3)
You may need an appropriate loader to handle this file type.
(Source code omitted for this binary file)
@ ./node_modules/core-js/modules/_fix-re-wks.js 2:0-28
@ ./node_modules/core-js/modules/es6.regexp.split.js
@ ./node_modules/cache-loader/dist/cjs.js??ref--12-0!./node_modules/babel-loader/lib!./node_modules/vuetify-loader/lib/loader.js!./node_modules/cache-loader/dist/cjs.js??ref--0-0!./node_modules/vue-loader/lib??vue-loader-options!./src/views/ui/Datepicker.vue?vue&type=script&lang=js&
@ ./src/views/ui/Datepicker.vue?vue&type=script&lang=js&
@ ./src/views/ui/Datepicker.vue
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://10.5.33.62:8080/sockjs-node (webpack)/hot/dev-server.js ./src/main.js
When run npm run dev
, it report those error.
Do you miss the ESLint configuration file?
`$ npm run dev
[email protected] dev /home/user/WebstormProjects/vue-material-admin
webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
94% asset optimization
ERROR Failed to compile with 1 errors 12:07:56
This dependency was not found:
To install it, you can run: npm install --save @/components/widgets/card/NameCard`
....
...
@ ./src/components/email/List.vue 1:0-83 10:2-8 11:2-17 30:4-35:6 30:67-35:5 32
:16-22 33:25-40
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/email/Reply.vue?vue&type=template&id=5bbe7137&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
|
|
@ ./src/components/email/Reply.vue 1:0-84 10:2-8 11:2-17 30:4-35:6 30:68-35:5 3
2:16-22 33:25-40
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/pages/ui/Colors.vue?vue&type=template&id=2fc45e17&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
|
|
@ ./src/pages/ui/Colors.vue 1:0-85 11:2-8 12:2-17 31:4-36:6 31:69-36:5 33:16-22
34:25-40
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/AppFab.vue?vue&type=template&id=23640754&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
| <v-btn fab="fab" small dark="dark" fixed="fixed" bottom="bottom" right="righ
t" color="red" v-scroll="onScroll" v-show="fab" @click="toTop">
| keyboard_arrow_up
@ ./src/components/AppFab.vue 1:0-85 10:2-8 11:2-17 30:4-35:6 30:69-35:5 32:16-
22 33:25-40
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/widgets/form/ShipmentForm.vue?vue&type=template&id=6
62a6d49&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
| CONTACT DETAIL
| <v-text-field
@ ./src/components/widgets/form/ShipmentForm.vue 1:0-91 10:2-8 11:2-17 30:4-35:
6 30:75-35:5 32:16-22 33:25-40
@ ./src/pages/form/BasicForms.vue?vue&type=script&lang=js&
@ ./src/pages/form/BasicForms.vue
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/widgets/form/PaymentForm.vue?vue&type=template&id=30
cb06ef&scoped=true&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
| Payment Method
|
@ ./src/components/widgets/form/PaymentForm.vue 1:0-102 11:2-8 12:2-17 31:4-36:
6 31:86-36:5 33:16-22 34:25-40
@ ./src/pages/form/BasicForms.vue?vue&type=script&lang=js&
@ ./src/pages/form/BasicForms.vue
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/PageHeader.vue?vue&type=template&id=ad84f3a8&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
|
@ ./src/components/PageHeader.vue 1:0-89 10:2-8 11:2-17 30:4-35:6 30:73-35:5 32
:16-22 33:25-40
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/AppDrawer.vue?vue&type=template&id=45c1f172&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
<v-navigation-drawer
| id="appDrawer"
| :mini-variant.sync="mini"
@ ./src/components/AppDrawer.vue 1:0-88 11:2-8 12:2-17 31:4-36:6 31:72-36:5 33:
16-22 34:25-40
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/AppToolbar.vue?vue&type=template&id=5e36a16c&
Module parse failed: Unexpected token (2:0)
You may need an appropriate loader to handle this file type.
|
<v-toolbar
| color="primary"
| fixed
@ ./src/components/AppToolbar.vue 1:0-89 10:2-8 11:2-17 30:4-35:6 30:73-35:5 32
:16-22 33:25-40
@ ./src/App.vue?vue&type=script&lang=js&
@ ./src/App.vue
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/chat/ChatMenu.vue?vue&type=template&id=4f775a24&
Module parse failed: Unexpected token (2:2)
You may need an appropriate loader to handle this file type.
|
|
@ ./src/components/chat/ChatMenu.vue 1:0-87 11:2-8 12:2-17 31:4-36:6 31:71-36:5
33:16-22 34:25-40
@ ./src/components/chat/ChatLayout.vue?vue&type=script&lang=js&
@ ./src/components/chat/ChatLayout.vue
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/pages/Error.vue?vue&type=style&index=0&id=e0e013d8&scoped=true&
lang=css&
Module parse failed: Unexpected token (30:3)
You may need an appropriate loader to handle this file type.
|
|
h1 {
| font-size: 150px;
| line-height: 150px;
@ ./src/pages/Error.vue 4:0-89
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/pages/Deny.vue?vue&type=style&index=0&id=a646d2a0&scoped=true&l
ang=css&
Module parse failed: Unexpected token (30:3)
You may need an appropriate loader to handle this file type.
|
|
h1 {
| font-size: 150px;
| line-height: 150px;
@ ./src/pages/Deny.vue 4:0-88
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/chat/ChatMenu.vue?vue&type=style&index=0&lang=stylus
&
Module parse failed: Unexpected token (33:0)
You may need an appropriate loader to handle this file type.
|
|
.mini-tile
| a.list__tile--active
| background:hsla(0,0%,100%,.12)
@ ./src/components/chat/ChatMenu.vue 4:0-71
@ ./src/components/chat/ChatLayout.vue?vue&type=script&lang=js&
@ ./src/components/chat/ChatLayout.vue
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/pages/ui/Button.vue?vue&type=style&index=0&lang=css&
Module parse failed: Unexpected token (388:0)
You may need an appropriate loader to handle this file type.
|
|
.custom-loader {
| animation: loader 1s infinite;
| display: flex;
@ ./src/pages/ui/Button.vue 4:0-66
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/pages/form/Editors.vue?vue&type=style&index=0&id=5523c33f&lang=
stylus&scoped=true&
Module parse failed: Unexpected token (46:0)
You may need an appropriate loader to handle this file type.
|
|
.quill
| height : 520px
|
@ ./src/pages/form/Editors.vue 4:0-94
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/components/widgets/card/PostListCard.vue?vue&type=style&index=0
&id=07c7408d&scoped=true&lang=css&
Module parse failed: Unexpected token (78:0)
You may need an appropriate loader to handle this file type.
|
|
.ft-200 {
| font-weight: 200;
| }
@ ./src/components/widgets/card/PostListCard.vue 4:0-96
@ ./src/pages/Dashboard.vue?vue&type=script&lang=js&
@ ./src/pages/Dashboard.vue
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
error in ./src/pages/ui/Icon.vue?vue&type=style&index=0&id=5b3e6860&scoped=tru
e&lang=css&
Module parse failed: Unexpected token (89:0)
You may need an appropriate loader to handle this file type.
|
|
.demo-icons-list {
| display: -webkit-box;
| display: flex;
@ ./src/pages/ui/Icon.vue 4:0-88
@ ./src/router/paths.js
@ ./src/router/index.js
@ ./src/main.js
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-ser
ver.js ./src/main.js
And this is my package.json
{
"name": "vue-material-admin",
"version": "1.0.0",
"description": "A Vue Material Admin Template",
"author": "Micahel Wang [email protected]",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"unit": "jest --config test/unit/jest.conf.js --coverage",
"e2e": "node test/e2e/runner.js",
"test": "npm run unit && npm run e2e",
"lint": "eslint --ext .js,.vue src test/unit test/e2e/specs",
"build": "node build/build.js"
},
"dependencies": {
"@babel/preset-react": "^7.0.0",
"font-awesome": "^4.7.0",
"lint": "^1.1.2",
"lodash.truncate": "^4.4.2",
"nprogress": "^0.2.0",
"quill": "^1.3.6",
"vee-validate": "^2.1.4",
"vue": "^2.5.21",
"vue-fullcalendar": "^1.0.9",
"vue-perfect-scrollbar": "^0.1.0",
"vue-quill-editor": "^3.0.6",
"vue-resize": "^0.4.4",
"vue-router": "^3.0.2",
"vuetify": "^1.3.14"
},
"devDependencies": {
"@babel/preset-env": "^7.2.3",
"autoprefixer": "^9.4.3",
"babel-eslint": "^10.0.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-jest": "^23.6.0",
"babel-loader": "^7.1.5",
"babel-plugin-dynamic-import-node": "^2.2.0",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-es2015-modules-commonjs": "^6.26.2",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-plugin-transform-vue-jsx": "^3.7.0",
"babel-preset-env": "^1.7.0",
"babel-preset-stage-2": "^6.24.1",
"babel-register": "^6.26.0",
"chalk": "^2.4.1",
"chromedriver": "^2.45.0",
"copy-webpack-plugin": "^4.6.0",
"cross-spawn": "^6.0.5",
"css-loader": "^2.0.1",
"eslint": "^5.10.0",
"eslint-config-alloy": "^1.4.2",
"eslint-config-standard": "^12.0.0",
"eslint-friendly-formatter": "^4.0.1",
"eslint-loader": "^2.1.1",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-node": "^8.0.0",
"eslint-plugin-promise": "^4.0.1",
"eslint-plugin-standard": "^4.0.0",
"eslint-plugin-vue": "^5.0.0",
"extract-text-webpack-plugin": "^3.0.2",
"faker": "^4.1.0",
"file-loader": "^2.0.0",
"friendly-errors-webpack-plugin": "^1.7.0",
"fs-finder": "^1.8.1",
"html-webpack-plugin": "^3.2.0",
"jest": "^23.6.0",
"jest-serializer-vue": "^2.0.2",
"json-schema-faker": "^0.5.0-rc9",
"json-server": "^0.14.0",
"less-loader": "^4.1.0",
"mime-types": "^2.1.21",
"mockjs": "^1.0.1-beta3",
"mockjs-webpack-plugin": "^1.0.0",
"nightwatch": "^1.0.16",
"node-dir": "^0.1.17",
"node-notifier": "^5.3.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"ora": "^3.0.0",
"portfinder": "^1.0.20",
"postcss-import": "^12.0.1",
"postcss-loader": "^3.0.0",
"postcss-url": "^8.0.0",
"raw-loader": "^1.0.0",
"rimraf": "^2.6.2",
"selenium-server": "^3.141.59",
"semver": "^5.6.0",
"shelljs": "^0.8.3",
"stylus": "^0.54.5",
"stylus-loader": "^3.0.2",
"uglifyjs-webpack-plugin": "^2.0.1",
"url-loader": "^1.1.2",
"vue-jest": "^3.0.2",
"vue-loader": "^15.4.2",
"vue-style-loader": "^4.1.2",
"vue-template-compiler": "^2.5.21",
"webpack": "^4.28.2",
"webpack-bundle-analyzer": "^3.0.3",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10",
"webpack-merge": "^4.1.5"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
help to solve this issue.
сначала выходит такая ошибка:
:~/vue-material-admin$ yarn dev
yarn run v1.12.3
$ webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
94% after seal
ERROR Failed to compile with 2 errors 10:27:58
error in (webpack)-dev-server/client?http://localhost:8080
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '@babel/core'
babel-loader@8 requires Babel 7.x (the package '@babel/core'). If you'd like to use Babel 6.x ('babel-core'), you sho uld install 'babel-loader@7'.
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15)
at Function.Module._load (internal/modules/cjs/loader.js:506:25)
at Module.require (internal/modules/cjs/loader.js:636:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (/home/srf/vue-material-admin/node_modules/babel-loader/lib/index.js:10:11)
at Module._compile (internal/modules/cjs/loader.js:688:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
at Module.load (internal/modules/cjs/loader.js:598:32)
at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
at Function.Module._load (internal/modules/cjs/loader.js:529:3)
at Module.require (internal/modules/cjs/loader.js:636:17)
at require (internal/modules/cjs/helpers.js:20:18)
at loadLoader (/home/srf/vue-material-admin/node_modules/loader-runner/lib/loadLoader.js:13:17)
at iteratePitchingLoaders (/home/srf/vue-material-admin/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
at runLoaders (/home/srf/vue-material-admin/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
at NormalModule.doBuild (/home/srf/vue-material-admin/node_modules/webpack/lib/NormalModule.js:280:3)
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.js
error in ./src/main.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module '@babel/core'
babel-loader@8 requires Babel 7.x (the package '@babel/core'). If you'd like to use Babel 6.x ('babel-core'), you sho uld install 'babel-loader@7'.
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15)
at Function.Module._load (internal/modules/cjs/loader.js:506:25)
at Module.require (internal/modules/cjs/loader.js:636:17)
at require (internal/modules/cjs/helpers.js:20:18)
at Object.<anonymous> (/home/srf/vue-material-admin/node_modules/babel-loader/lib/index.js:10:11)
at Module._compile (internal/modules/cjs/loader.js:688:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10)
at Module.load (internal/modules/cjs/loader.js:598:32)
at tryModuleLoad (internal/modules/cjs/loader.js:537:12)
at Function.Module._load (internal/modules/cjs/loader.js:529:3)
at Module.require (internal/modules/cjs/loader.js:636:17)
at require (internal/modules/cjs/helpers.js:20:18)
at loadLoader (/home/srf/vue-material-admin/node_modules/loader-runner/lib/loadLoader.js:13:17)
at iteratePitchingLoaders (/home/srf/vue-material-admin/node_modules/loader-runner/lib/LoaderRunner.js:169:2)
at runLoaders (/home/srf/vue-material-admin/node_modules/loader-runner/lib/LoaderRunner.js:362:2)
at NormalModule.doBuild (/home/srf/vue-material-admin/node_modules/webpack/lib/NormalModule.js:280:3)
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.js
починил командой $ yarn add @babel/core
теперь такая ошибка которую не могу победить:
~/vue-material-admin$ yarn dev
yarn run v1.12.3
$ webpack-dev-server --inline --progress --config build/webpack.dev.conf.js
94% after seal
ERROR Failed to compile with 1 errors 10:39:12
error in ./src/main.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Plugin/Preset files are not allowed to export objects, only functions. In /home/srf/vue-material-admin/node_modules/babel-preset-stage-2/lib/index.js
at createDescriptor (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-descriptors.js:178:11)
at items.map (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-descriptors.js:109:50)
at Array.map (<anonymous>)
at createDescriptors (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-descriptors.js:109:29)
at createPresetDescriptors (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-descriptors.js:101:10)
at presets (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-descriptors.js:47:19)
at mergeChainOpts (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-chain.js:320:26)
at /home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-chain.js:283:7
at buildRootChain (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/config-chain.js:120:22)
at loadPrivatePartialConfig (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/partial.js:85:55)
at Object.loadPartialConfig (/home/srf/vue-material-admin/node_modules/@babel/core/lib/config/partial.js:110:18)
at Object.<anonymous> (/home/srf/vue-material-admin/node_modules/babel-loader/lib/index.js:140:26)
at Generator.next (<anonymous>)
at asyncGeneratorStep (/home/srf/vue-material-admin/node_modules/babel-loader/lib/index.js:3:103)
at _next (/home/srf/vue-material-admin/node_modules/babel-loader/lib/index.js:5:194)
at /home/srf/vue-material-admin/node_modules/babel-loader/lib/index.js:5:364
@ multi (webpack)-dev-server/client?http://localhost:8080 (webpack)/hot/dev-server.js ./src/main.js
Kindly update to Vuetify 2.0
@tookit Thanks for this awesome theme BDW! 👍
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.