cli create new webpack template project

This time I will bring you a new cli webpack template project. What are the precautions for cli new webpack template project? The following is a practical case, let's take a look.

vuepress is a brand new Vue-based static website generator released by Youda on April 12. It is actually a Vue spa application with built-in webpack, which can be used to write documents. I happened to need to write documentation for some components recently, so I started working on it. After all, it had just been released and encountered many pitfalls. In the end, it was running with a lot of bumps. In order to avoid everyone stepping into the same pitfalls, I deliberately recorded the construction process. Come on down and share.

The following are several known issues

Because util.promisify was introduced after node 8.0, so if you don’t want to waste three hours like me Time, please check and update the node version

It is recommended not to use the webpack-simple template for testing, otherwise it will not run in various ways╮(╯▽╰)╭

If you use the cli template The error TypeError: Cannot read property 'vue' of undefined is because the vueloader built in vuepress's built-in webpack uses a different version than your local one. Please update the local version to the latest stable version

When the official installation documentation appears If it always jumps to 404 after deployment, please use the routing hash mode to access

If you encounter problems such as port conflicts, create a new .vuepress folder in the docs directory, and then create a new config configuration file. The prot port item can be configured. For details, please refer to the official documentation

Get started

Use cli to create a new webpack template project

//进入项目首先安装依赖
  npm install  
  //将vue-loader进行版本替换，使其和vuepress内置的webpack里的vue-loader保持一致，否则会报错（不过尤大大已经在解决版本冲突的问题了，版本待发）
  npm update vue-loader@15.0.0-rc.2 --save-dev 
  //接下来安装vuepress
 npm install -D vuepress
 mkdir docs
 echo "# Hello VuePress!" > docs/README.md
 //最后一步启动vuepress ，进入docs目录，使用vuepress dev命令即可
 cd docs
 vuepress dev
 //使用vuepress build即可完成对项目的打包
 //接下来就是按照官方的文档，对你的网站进行各种创造啦

For project deployment, I use github. For specific operations, please refer to the official documentation

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the PHP Chinese website!

Recommended reading:

How to sort json objects and delete data with the same id

How to use Angular to launch a component

The above is the detailed content of cli create new webpack template project. For more information, please follow other related articles on the PHP Chinese website!