Vue 3.0 个模块功能及介绍

  • es6-promise

对 jquery 的封装

in package.json

in main.js

意为: 包含 node-modules 目录 es6-promise 的  auto.js

  • babel-polyfill

转码器 ,能适应多个 browser

in main.js



vue component 笔记

怎么在html文件包含一个component :       learn from

怎么引用 单独一个 .vue 文件




vue 开源 dashboard 程序的login 部分

所指的开源程序是 :

template 引用变量的写法

加 $t 是为了unicode , 如果不需要,直接写{{ $t(‘auth.welcome’) }}

auth.welcome 是从  /src/i18n 目录的 json 文件得来

引用是在  main.js


/src/main.js 里, 这样写:

是因为 vue.config.js 这样定义了别名



Vue 各种问题的解决方法

  • 当执行

    时 ,报错



解决方法是 ;

不需要手动改  package.json , 会自动加进去

  • How to use Bootstrap 4 media query mixins


出自 Bootstrap 4 media query mixins

Bootstrap 4 media query mixins 的作用是 : 设置页面的布局 , 当size发生变化时 , 触发相应的断点 


解决方法是 :

package.json  dependencies 加

devDependencies  加

之后 nmp install

跟目录加  vue.config.js , 内容为

把 vuestic-admin-master 的  sass 和 vuestic-theme 文件夹copy 过去

  • 如何在 vs code debug Vue


最初的 json是


  • 怎么在 component 里使用另一个 component


  • 怎么在 vue 使用  scss

  • .vue 文件的   $t 是什么意思

是支持 unicode的意思 , 可以去掉

  • 怎么载入  scss

例子程序的scss 文件在 :   F:\code\Vue\vuestic-admin-master\src\vuestic-theme\vuestic-sass\overrides\_material-forms.scss

  • 为什么用 vue_cli 3.0 建立的程序一开始没有  vue.config.js

因为默认的并不需要,将来如果用到, 可以自己加

Where is the config files and why isn’t it anywhere in the top level folders, etc?

The initial project doesn’t require the file to exist because you just created a project with fresh “default” settings that don’t require any config.

Just create it yourself. it’s even mentioned in the README:

Many aspects of a Vue CLI project can be configured by placing a vue.config.js file at the root of your project. The file may already exist depending on the features you selected when creating the project.

(emphasis mine)

Edit: now to be found here:

**********   vue开源程序的  vue.config.js是这样的



  • vue-route

不像是以前一样点击  url 去服务器 request page  , 而是在本地 已经load 完成的页面之间转

in  package.json



  • 用 cli 3 工具新建
  • 新建 , 选手动

完成后占5g空间  , wtf   (在马来机器上只有 130MB ,  本机有问题)

  • 让 win10 像 linux 那样显示 folder树形结构


  • 加login 页面

learn from

  • 生成 dist

HTML Notes

  • scss是什么

CSS is the styling language that any browser understands to style webpages.

SCSS is a special type of file for SASS, a program written in Ruby that assembles CSS style sheets for a browser, and for information SASS adds lots of additional functionality to CSS like variables, nesting and more which can make writing CSS easier and faster. SCSS files are processed by the server running a web app to output a traditional CSS that your browser can understand.

例子 :

  • webpack 是什么


  • 怎么加入 css


如果样式表简单, 直接写在 head 里


还有inline  css


padding , margin , etc

css 模板站  :



安装使用 Vue

  • 新建一个目录, 随便起名, 这里叫  Vue
  • 下载客户端工具

    • 查看客户工具版本


  • 用客户端工具新建一个 pwa 应用

  • 这个是 cli 2的用法 ,  cli 3 是


  • 来源网站


新建项目 ,

是用的 vue 2.0 做例子 ,没什么参考价值了

用 vue 建一个 天气的  dashboard


另外一个 dashboard

spring boot 做 rest server ,  vue 做 client ,  crud


怎么把从 rest 取到的数显示在 table 里


到现在为止 2019-06-18  12:00:00AM

发现的最好的教程   这个是收费的   中文

开源免费的vue dashboard   这个更好一点 

上一个网址的git 是




  • vue 怎么定义 templete

a)  直接写在 js 文件里  或者 html 页面里

b) SFC  single file component  最主流的办法

  • 带源码的 side bar


  • tips

a) vue 没有页面的概念, 全是组件 , 在不同组件之间切换用  vue-router , 组件以 .vue结尾



c) 写好 component之后用 webpack 编译打包 , webpack 需要: 入口js文件:main.js

d)  vue 的  render


cnblog 文章