Article directory
foreword
There have been some small moves recently. There are two projects that need to be advanced, and the front-end stuff has to be picked up.
environment
Since my current environment is still vue2, this development is still mainly vue2. Of course, it is not difficult to switch. I just don't bother to configure the environment here. It's tiring. I can't forget my iris version problem when I played go. one day.
vue-cli project creation
My local vue version is still 2.5x
, so I can't create a project. I can't vue create or I can only vue init webpack name
. I just want to say a few things about project creation. The first npm is really slow, it is not recommended to use it, it is recommended to download cnpm first .
npm install -g cnpm --registry=https://registry.npm.taobao.org
Then find a suitable location to start creating our project.
The words here are still the old rules. After the first few yess, I suggest that you select the route first, and then enter our project after the no and
other no
. Here, it generates the routing code for us, but we do it here. A small makeover.
Retrofit one
Project structure.
Retrofit II
Retrofit three
change icon
test
You can see the effect.
At this point, our basic project transformation is completed.
Then import our element ui component library. (In fact, at this time, I can choose to directly get the dependencies of the project I wrote last time directly)
使用 element
First we have to download
cnpm i element-ui -S
In this case, you can actually choose to add a -g and download it globally.
then import the component
/*引入element组件*/
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
install loader
This is mainly the css that loads the element ui
cnpm install sass-loader node-sass --save-dev
test
ok, let's test it next.
Introduce our button test into our component.
Summarize
I recalled the process again, and then went to the components.
This time there is more time, after all, I am not a novice, so it should be faster.