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 中项目所依赖的包
文件目录结构的简单说明