[Study notes a Vue, Vue development environment to build]

  Vue development environment to build

  1. First install Nodejs (because my system is Windows, so choose the first one, and this depends on your individual development environment)

    

    Once you have downloaded, and then all the way to determine if there is a demand to change the installation directory, switch installation directory on their own, because it is written in this blog from the Internet, so it does not matter

    Open cmd input node --version

     

     Nodejs version appears on the success! The next step then install cnpm (installation which main purpose is to conduct domestic use Taobao, installation of comparison block)

      

       The method of installation, the following input commands from the console command cmd

          

Elevation install g cnpm --registry = https: // registry.npm.taobao.org

       Figure appears at the installation is successful

       

        

      2. vue development environment to build, install scaffolding vue tool, enter the following command

      

cnpm install --global vue-cli 

    You can also use the command npm install --global vue-cli (this can also be used, but I personally do not recommend, as long as the download speed is really slow wife)

    Installation process is as follows, speed dancing, Amway for everyone

    

    

    3. Create a project must cd into a corresponding item inside

         vue init webpack shock-demo01

    

 

    The installation process may be slow, please be patient.

    Then, unfortunately, and I successfully installed, no error occurred, as follows,

    

 

     Run command on the chart, but my error, and does not start, so the use of solutions

    Entry    

    cnpm install   

    

    After a successful installation, and then enter the command console 

        cnpm run dev 

     

      貌似成功启动了,然后使用浏览器打开  localhsot:8080 看看 

      

 

      我使用的是Vs code  安装vue 的代码提示插件 

      

        然后修改其中的App.vue 代码,返回浏览器中查看

        

            修改成功!!!!    搭建成功!!!!

 

 

      但是还没有剧终!!!!

      

      还有另一种创建项目的方式  (推荐)

        vue init webpack-simple vuedemo02

        cd vuedem02

        (如果出现错误,或者启动不了执行下面的命令)

         cnpm install    或者 npm install

        

 

        然后执行启动  这次端口改成了  localhost:8081

         

          

      

          还有就是拿到一个项目,如果项目中没有node_modules 这个文件夹,可以使用 

          cnpm install 来安装   package.json 中项目所依赖的包

          

 

文件目录结构的简单说明

      

 

Guess you like

Origin www.cnblogs.com/kangxinxin/p/11261661.html