Vue.js 开发环境搭建笔记

1 配置 Webstorm

1.1 解决vue文件v字图标显示问题:

安装 GitHub – ChrisRM/material-theme-jetbrains: JetBrains theme of Material Theme 这个主题 注意不要安装 vue-for-idea那个插件 功能不全用起来不爽

1.2 解决vue文件代码高亮:

设置 – Editor – File types – HTML ,添加*.vue

1.3 解决webstorm不能识别es6的问题:

设置 – Language&Frameworks – Javascript, 右侧选择version为ES6

1.4 解决sass,less等异构语言显示报错问题:

在样式标签里面写上对应的异构语言,webstorm根据rel属性区分的,如

<style lang="scss" rel="stylesheet/scss">
// 这里面就可以写sass了
</style>

<style lang="less" rel="stylesheet/less">
// 这里面就可以写less了
</style>

1.5 解决写模板的时候没有vue指令智能提示:

设置 – Inspections – HTML – Unknown HTML tags,添加customs:

v-text
v-html
v-once
v-if
v-show
v-else
v-for
v-on
v-bind
v-model
v-ref
v-el
v-pre
v-cloak
v-on:click
v-on:keyup.enter
v-on:keyup
@click
@change
number
debounce
transition
:is

1.6 关闭webstorm保存缓存,使nodejs的dev服务器实时预览生效:

设置 – Appearance&Behavior – System Settings, 取消勾选 Use “safe write”

2 安装开发环境

2.1 安装nodejs

官网下载即可

2.2 安装vue-cli

npm install -g vue-cli

2.3 使用vue的webpack模板新建项目

vue init webpack hello-vue
cd hello-vue 
npm install 
npm run dev # ready to go!

3 其他配置

3.1 配置后端转发

需要在npm的node dev server里访问后端数据的时候可以配置转发,在config的index.js中proxyTable里进行配置:

{'/ajax/': 'http://a.com/'}

如此配置时,ajax的访问会自动转发至a.com/ajax

参考

https://www.zhihu.com/question/20936155/answer/111454501
http://vue-loader.vuejs.org/

胧月夜之祈祷

菜の花畠に入日薄れ
●黄花田里夕阳薄
见渡す山の端霞ふかし
●远望山端暮霞深
春风そよふく空を见れば
●春风和煦望天空
夕月かかりてにおい淡し
●夕月高挂花气淡
里わの火影も森の色も
●村落灯火 森林暮色
田中の小路をたどる人も
●田间小路行路人
蛙のなくねもかねの音も
●蛙鸣声钟声
さながら霞める胧月夜
●尽染晚霞的胧月夜
闻いて闻いて瞳闭じたら
●听,听 闭上双目
风の星の歌がきこえる
●能听到风的星之歌
菜の花畠に入日薄れ
●黄花田里夕阳薄
见渡す山の端霞ふかし
●远望山端暮霞深
春风そよふく空を见れば
●春风和煦望天空
夕月かかりてにおい淡し
●夕月高挂花气淡
遥か遥か远い未来に
●向遥远遥远的未来
强く强く辉き放て
●强烈强烈地闪着光辉
全て全て母なる大地
●一切一切啊大地母亲
生きて生きてこの胸の中
●鲜活鲜活地 在我胸中

致橡树

致橡树

舒婷

我如果爱你——
绝不像攀援的凌霄花,
借你的高枝炫耀自己:
我如果爱你——
绝不学痴情的鸟儿,
为绿荫重复单调的歌曲;
也不止像泉源,
常年送来清凉的慰籍;
也不止像险峰,增加你的高度,衬托你的威仪。
甚至日光。
甚至春雨。
不,这些都还不够!
我必须是你近旁的一株木棉,
做为树的形象和你站在一起。
根,紧握在地下,
叶,相触在云里。
每一阵风过,
我们都互相致意,
但没有人
听懂我们的言语。
你有你的铜枝铁干,
像刀,像剑,
也像戟,
我有我的红硕花朵,
像沉重的叹息,
又像英勇的火炬,
我们分担寒潮、风雷、霹雳;
我们共享雾霭、流岚、虹霓,
仿佛永远分离,
却又终身相依,
这才是伟大的爱情,
坚贞就在这里:
不仅爱你伟岸的身躯,
也爱你坚持的位置,脚下的土地。