zoukankan      html  css  js  c++  java
  • node搭环境(四)--webpack启服务运行VUE模块文件(手写简单脚手架)

    webpack启服务步骤:

    1、新建空文件夹webpack-vue。在空文件夹右键点击- GIt Bath here--输入cnpm init--按程序走完会生成package.json文件

    2、打开package.json文件,先把main和scripts对应内容修改

    3、在package.json 安装相关模板(生产模块/开发模块/服务命令).

       输入cnpm install vue --save 安装开发环境

    package.json里面便会对应的出现vue文件

    输入cnpm i -D webpack webpack-dev-server

    输入 cnpm i -D vue-loader vue-html-loader vue-style-loader vue-template-compiler

    输入 cnpm i -D css-loader file-loader style-loader

     

    输入 cnpm i -D babel-loader babel-core babel-preset-env

    输入cnpm i -D babel-preset-env 会根据配置的运行环境自动启动需要的babel插件

    以上安装的插件如下,也可直接复制。

    4、配置webpack  创建webpack.config.js

    5、编写main.js    

    //main.js是入口文件, webpack编译会通过根目录文件打包到build.js

    6、APP.vue

    7、User.vue

    8、编写babelrc

    9、index.html引用build.js

    //此时webpack将js/vue 打包到build.js,先执行Npm install

    10、运行测试 npm run dev

  • 相关阅读:
    来换网心得总结
    关于项目来换网
    数据库设计源代码
    自我介绍
    WC项目
    关于《现代软件工程》此书的疑问
    Swift基础语法(常量变量、数据类型、元组、可选、断言等)
    grunt快速学习
    Swift语言简介
    Swift简单入门教程:30分钟玩转Swift
  • 原文地址:https://www.cnblogs.com/colorful-paopao1/p/9165694.html
Copyright © 2011-2022 走看看