text: (window.webpackJsonp=window.webpackJsonp||[]).push([[6],{23:function(e,a,p){var r=p(24);"string"==typeof r&&(r=[[e.i,r,""]]),r.locals&&(e.exports=r.locals);(0,p(2).default)("data-quickpaper-0823a29e",r,!0)},24:function(e,a,p){(e.exports=p(1)(!1)).push([e.i,"\n [quickpaper]{\n\npadding: 0 calc(50vw - 350px);\n\nheight: calc(100vh - 60px);\n\nwidth: 100vw;\n\noverflow: auto;\n\n}\n",""])},36:function(e,a,p){"use strict";p.r(a);var r={};p(23);r.render=function(e){return e("div",{class:"doc-view",quickpaper:"","data-quickpaper-0823a29e":""},[e("header",{"data-quickpaper-0823a29e":""},["开始使用"]),e("h2",{"data-quickpaper-0823a29e":""},["开发环境搭建"]),e("p",{"data-quickpaper-0823a29e":""},["首先你需要通过命令行安装QuickPaper，就像这样："]),e("pre",{"q-code":"","data-quickpaper-0823a29e":""},["npm install --save quick-paper"]),e("p",{"data-quickpaper-0823a29e":""},["然后，我们需要配置webpack如何解析.paper文件（比如在webpack.config.js文件中）："]),e("pre",{"q-code":"","data-quickpaper-0823a29e":""},["const QuickPaperLoaderPlugin = require('quick-paper/loader-plug/index.js');↵module.exports = {↵     module: {↵        rules: [{↵            test: /\\.paper$/,↵            loader: ['quick-paper/loader/index.js']↵        },{↵            test: /\\.(css|scss)$/,↵            loader: ['quick-paper/style-loader/index.js', 'css-loader', 'postcss-loader', './scss-loader.js']↵        }]↵     },↵    plugins: [↵        new QuickPaperLoaderPlugin()↵    ]↵};"]),e("p",{"data-quickpaper-0823a29e":""},["配置好了以后，基本的开发环境就搭建好了！"]),e("h2",{"data-quickpaper-0823a29e":""},["如何使用？"]),e("p",{"data-quickpaper-0823a29e":""},["首先，需要准备好框架管理的区域，比如页面中有如下的div："]),e("pre",{"q-code":"html","data-quickpaper-0823a29e":""},["<div id='root'></div>"]),e("p",{"data-quickpaper-0823a29e":""},["接着，创建对象即可："]),e("pre",{"q-code":"","data-quickpaper-0823a29e":""},["import QuickPaper from 'quick-paper';↵import App from './App.paper';↵↵new QuickPaper({↵    el:document.getElementById('root'),↵    render: createElement => createElement(App)↵});"]),e("p",{"data-quickpaper-0823a29e":""},["此时，你就可以在文件App.paper（关于paper文件的说明，请查看",e("a",{href:"#/api/component?fixed=define-paper",target:"_blank",class:"link","data-quickpaper-0823a29e":""},["使用paper文件创建"]),"一节进行学习）中使用框架的语法了。"])])};a.default=r}}]);