# vue_cesium_template

**Repository Path**: houxiaoqi1/vue_cesium_template

## Basic Information

- **Project Name**: vue_cesium_template
- **Description**: cesium初始化配置
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2022-04-24
- **Last Updated**: 2022-04-24

## Categories & Tags

**Categories**: Uncategorized

**Tags**: Cesium, Vue

## README

# vue-cesium-template
基于Vue的简Cesium开发模板

## 项目初始化
```
npm install
```

## 编译
```
npm run serve
```

## 打包
```
npm run build
```

## 配置方式
## vue.config,js
```
let cesiumSource = './node_modules/cesium/Source'
```
```
let cesiumWorkers = '../Build/Cesium/Workers'
```
#在webpack的相关配置
```
    resolve: {
      alias: {
        'vue$': 'vue/dist/vue.esm.js',
        '@': path.resolve('src'),
        'cesium': path.resolve(__dirname, cesiumSource)
      }
    },
    plugins: [
      new CopyWebpackPlugin([{ from: path.join(cesiumSource, cesiumWorkers), to: 'Workers' }]),
          new CopyWebpackPlugin([{ from: path.join(cesiumSource, 'Assets'), to: 'Assets' }]),
          new CopyWebpackPlugin([{ from: path.join(cesiumSource, 'Widgets'), to: 'Widgets' }]),
          new CopyWebpackPlugin([{ from: path.join(cesiumSource, 'ThirdParty/Workers'), to: 'ThirdParty/Workers' }]),
          new webpack.DefinePlugin({
        CESIUM_BASE_URL: JSON.stringify('./')
      })
    ],
```
## main.js
```
var Cesium = require('cesium/Cesium');
var widgets= require('cesium/Widgets/widgets.css');
Vue.prototype.Cesium = Cesium;
Vue.prototype.widgets = widgets;
```
##或者在组件中使用
##也可以用按需引入的方式，具体路径需要自己调整
```
import * as Cesium from "@/../node_modules/cesium/Source/Cesium.js"
import Viewer from "cesium/Source/Widgets/Viewer/Viewer";
```