用vue.js学习es6(一):基本工具及配置

一.工具:

  sublime,node.js,npm

  1.安装sublime 的es6插件:

  (1).在sublime中按Ctrl+`调出console

  (2).粘贴以下代码到底部命令行并回车(sublime 3):

    import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path();urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler())); open(os.path.join(ipp,pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())

  (sublime 2):

    import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print'Please restart Sublime Text to finish installation')

  (3).重启Sublime

  (4).如果在Perferences->package settings中看到package control这一项,则安装成功

  (5).按下Ctrl+Shift+P调出命令面板,输入javascriptNext:可以看到有es6插件回车安装

  2.将npm变成cnpm:npm install -g cnpm --registry=https://registry.npm.taobao.org

    注意:只有npm版本大于3.0.8才可以使用vue,npm升级:npm i npm g(最新)

  3.安装webpack:cnpm install vue -g

  4.安装vue命令行工具:cnpm install -g vue-cli

二.步骤:(注意)

  1.建立文件夹:名字叫vue

  2.创建项目:C:\vue>vue init webpack es6

  配置如下:

  ? Project name es6
  ? Project description A Vue.js project
  ? Author wzh
  ? Vue build standalone
  ? Use ESLint to lint your code? No
  ? Setup unit tests with Karma + Mocha? Yes
  ? Setup e2e tests with Nightwatch? Yes

  3.安装package.json中的插件:

  (1).进入es6文件夹:C:\vue>cd es6

  (2).C:\vue\es6>cnpm install

  4.运行:npm run dev

  如果自动打开了网页(http://localhost:8080/)显示vue的图标以及一些文字就说明运行成功了。

  5.找到C:\vue\es6\src\components\Hello.vue文件修改:

    <script>

    export default {

      name: 'hello',

      data () {

        studyEs6();

        return {

          msg: '欢迎 to Your Vue.js App'

        }

      }

    }

    function studyEs6(){

      alert("学习es6");

    }

  </script>

  添加了函数studyEs6()这样就可以执行es6语法了

上一篇:MySQL中 指定字段排序函数field()的用法


下一篇:mysql 中order by 与group by的顺序